onde estão os arquivos e a configuração do webpack create-react-app?

Crio um projeto ReactJS com o create-react-apppacote e funcionou bem, mas não consigo encontrar arquivos e configurações do webpack.

Como o react-create-app funciona com o webpack? Onde estão os arquivos de configuração do webpack em uma instalação padrão create-react-app? Não consigo encontrar os arquivos de configuração nas pastas do meu projeto.

Eu não criei um arquivo de configuração de substituição. Posso gerenciar as definições de configuração com outros artigos, mas quero encontrar os arquivos de configuração convencionais.

Se você deseja encontrar arquivos e configurações do webpack, acesse o arquivo package.json e procure por scripts

Você descobrirá que o objeto scripts está usando uma biblioteca react-scripts

Agora vá para node_modules e procure a pasta react-scripts react -script-in-node-modules

Essa pasta react -scripts / scripts e react -scripts / config contém todas as configurações do webpack.

A partir da documentação :

Você não precisa instalar ou configurar ferramentas como Webpack ou Babel. Eles são pré-configurados e ocultos para que você possa se concentrar no código.

Se você deseja ter acesso aos arquivos de configuração, é necessário ejetar executando:

npm run eject

Nota: esta é uma operação unidirecional. Depois de ejetar, você não pode voltar!

Na maioria dos cenários, é melhor não ejetar e tentar encontrar uma maneira de fazê-lo funcionar de outra maneira. Dessa forma, você pode atualizar suas dependências create-react-appe não precisar lidar com o inferno de dependências do Webpack.

Muitas pessoas acessam esta página com o objetivo de encontrar os arquivos e a configuração do webpack para adicionar sua própria configuração. Outra maneira de conseguir isso sem executar npm run ejecta execução é usar o react-app-rewired . Isso permite que você substitua seu arquivo de configuração do webpack sem ejetar.

Supondo que você não deseja ejetar e você apenas deseja ver a configuração, você as encontrará em /node_modules/react-scripts/config

webpack.config.dev.js. //used by `npm start`
webpack.config.prod.js //used by `npm run build`

A configuração do Webpack usada por create-react-appestá aqui: https://github.com/facebook/create-react-app/tree/master/packages/react-scripts/config

Você pode encontrá-lo dentro da pasta / config .

Quando você ejeta, você recebe uma mensagem como:

 Adding /config/webpack.config.dev.js to the project
 Adding /config/webpack.config.prod.js to the project

A configuração do Webpack está sendo manipulada por react -scripts . Você pode encontrar toda a configuração do webpack em node_modules react -scripts / config .

E se você deseja personalizar a configuração do webpack, você pode seguir este customize-webpack-config

Tente ejetar os arquivos de configuração executando:

npm run eject

então você encontrará uma pasta de configuração criada em seu projeto. Você encontrará os arquivos de configuração do webpack init.

Eu sei que é muito tarde, mas para futuras pessoas que se deparam com esse problema, se você quiser ter acesso à configuração do webpack do CRA, não há outra maneira, exceto que você precise executar:

$ npm run eject

No entanto, com a ejeção, você se desvia do pipeline de atualizações do CRA; portanto, do ponto de ejeção, é necessário mantê-lo.

Eu me deparei com esse problema muitas vezes e, portanto, criei um modelo para aplicativos de reação que têm a mesma configuração do CRA, mas também vantagens adicionais (como componentes estilizados, teste de unidade de brincadeira, Travis ci para implantações, mais bonito , ESLint, etc ...) para facilitar a manutenção. Confira o repo .