3

I have been instructed to put some instructions inside the webpack.config.js file. However in my create-react-app project I cannot find that file. Currently the available answer on StackOverFlow requires ejecting the project which I think will break my project. Is it possible to use webpack.config.js inside a create-react-app project without ejecting? Where is the webpack.config.js file? or where should I put it?

preston
  • 3,721
  • 6
  • 46
  • 78
  • Create react app suggests [this article](https://auth0.com/blog/how-to-configure-create-react-app/) as a way to configure your app without having to eject ([Source](https://create-react-app.dev/docs/alternatives-to-ejecting)) – apokryfos Oct 07 '19 at 12:22

3 Answers3

4

Webpack config used by create-react-app is here: https://github.com/facebook/create-react-app/tree/master/packages/react-scripts/config

Javad Khodadadi
  • 410
  • 1
  • 4
  • 13
4

create-react-app hides the config files from you. If you want to modify them, you have to run npm run eject. This will place them under the config/ folder.

Please read this before you do this, as this isn't a reversible action: https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md#npm-run-eject

Cereal
  • 3,699
  • 2
  • 23
  • 36
  • 1
    As much as possible I want to avoid ejecting....as I don't know how to work with a ejected project.....is there any other way? – preston Oct 08 '19 at 02:32
3

You would probably want to use Craco. It allows you to override create-react-app configurations. Other than that eject is a good option and it doesn't suppose to break your app

DSCH
  • 2,146
  • 1
  • 18
  • 29
  • How to add this webpack instructions in Craco? { test: /\.json$/, loader: 'url-loader', options: { limit: false, publicPath: 'assets' }, type:'javascript/auto' } – preston Oct 08 '19 at 02:44