Construindo webpack para produção - dependências reduzidas
Digamos que exista um módulo no npm chamado "awesomepackage". Posso registrá-lo como uma dependência do meu aplicativo viapackage.json
igual a:
npm i --save awesomepackage
Inspecionando meunode_modules
pasta Eu vejo uma pasta chamada "awesomepackage" que se parece com isso:
- index.js
- package.json
- README.md
- lib/
- awesomepackage.min.js
e posso usar o pacote dentro do meu próprio aplicativo da seguinte forma:
import {AwesomeThing} from 'awesomepackage';
Minha pergunta:Quando crio meu aplicativo usando o webpack, minha versão finalbundle.js
sempre contém o código fonte denode_modules/awesomepackage/index.js
- independentemente de quaisquer variáveis de ambiente que eu configurei (por exemplo,NODE_ENV=production
)
Existe alguma maneira de dizer ao webpack para usar os arquivos pré-criados (por exemplo,node_modules/awesomepackage/lib/awesomepackage.min.js
) se eles forem enviados como parte de um pacote NPM, em vez de serem recriados a partir da origem?
Eu vi soluçõeseste usar resolve.alias
enoParse
na configuração do webpack com caminhos codificados para arquivos de origem minificados, mas isso não anula o propósito de usar o npm e o webpack? Eu não quero ter que codificar e manter caminhos para os arquivos de compilação minificados de todas as dependências!
Cheguei aqui porque meubundle.js
saltou 2,5mb quando adicioneimoment.js
- com 167kb minificado, incluindo todos os locais, mas cujo código-fonte inclui 2mb de testes.
Claramente, há mais do que apenas minificar a finalbundle.js
arquivo no final. Por exemplo: por que alguém iria querer incluir centenas de testes de unidade desnecessários para dependências no código de produção final? Eles não. É por isso que a maioria das bibliotecas fornece umdist
(ou similar) como parte do módulo npm.