How to change the default configuration files used

Question

I've created a very basic hello world reactJs application using create-react-app command which is part of npm. Here is the directory structure which I get as part of the application template:

My package.json file looks like this:

{
  "name": "hello-world",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "react": "^15.4.2",
    "react-dom": "^15.4.2"
  },
  "devDependencies": {
    "react-scripts": "0.9.5"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  }
}

I observe that every time I perform npm run build command it uses index.html present in public directory and index.js present in src directory to create the final production build in build directory. I'm sure this is happening because of all the internal plumbing happening through npm. Can someone help me understand how this is happening and how can I change these targeted files to my own custom files named HelloWorld.html (present in public directory) and myApp.js (present in src directory)?

Answer 1

If you want to change the build configuration you can run npm run eject which will remove the build dependency from your project and will add configuration files to your project, allowing you to change them as you need.

• Note that this operation is a one way ticket, you can't go back!

https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#npm-run-eject