CODEWITHSUNDEEP
node.jsreactjssource-maps
Bharath Pabba
Bharath Pabba

Reputation: 1855

How to disable source maps for React JS Application?

My react folder structure is as below:

enter image description here

I haven't used the create-react-app version. I tried using GENERATE_SOURCEMAP=false, but it didn't work.

Where can I find the .map files? How can I delete those files?

I cannot find a build folder. I've tried using the below script, but it can't remove source maps.

 "scripts": {

    "start": "react-scripts start",
   "build": "GENERATE_SOURCEMAP=false && npm run build",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  },

Upvotes: 106

Views: 138343

Answers (11)

Meghanath M S
Meghanath M S

Reputation: 21

install cross-env npm install cross-env --save-dev

Put this one in your package.json "build": "cross-env GENERATE_SOURCEMAP=false react-scripts build", It works on Windows

Upvotes: 1

Sky
Sky

Reputation: 4370

Solution 1 (Recommended)

This solution is not operating system dependent and works on both Linux and Windows. Just create a file called .env in the root path of your project and add the following line to it:

GENERATE_SOURCEMAP=false

Solution 2

Edit your package.json like below:

  • Windows:
    "scripts": {
        "start": "react-scripts start",
        "build": "set \"GENERATE_SOURCEMAP=false\" &&  react-scripts build",
        "test": "react-scripts test",
        "eject": "react-scripts eject"
      },
  • Linux:
    "scripts": {
        "start": "react-scripts start",
        "build": "GENERATE_SOURCEMAP=false react-scripts build",
        "test": "react-scripts test",
        "eject": "react-scripts eject"
      },

Upvotes: 44

venky royal
venky royal

Reputation: 2250

just add GENERATE_SOURCEMAP=false in .env

Upvotes: 7

Toni
Toni

Reputation: 61

Put this one in your package.json

   "build": "cross-env GENERATE_SOURCEMAP=false react-scripts build",

It works on Windows and Linux...

Upvotes: 6

Nehemie KOFFI
Nehemie KOFFI

Reputation: 1395

What I have tested and which is working is to add this code in your .env.production file or .env file

GENERATE_SOURCEMAP=false

Upvotes: 37

Kyaw Kyaw Soe
Kyaw Kyaw Soe

Reputation: 3370

just remove &&

"scripts": {    
    "start": "react-scripts start",
    "build": "GENERATE_SOURCEMAP=false react-scripts build",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  }

Upvotes: 166

Kunal Burangi
Kunal Burangi

Reputation: 882

After long struggle nothing worked. Finally what worked for me is changing sourcemap: false in webpack.config.prod.js inside nodemodules/react-script/config hopefully it will work for you too.

Upvotes: 1

Raz
Raz

Reputation: 444

For windows cmd and create-react-app + react-scripts,

You should use set and close with \" YOUR_TMP_ENV_VAR \"

See example:

"deploy:prod:hosting": "set \"GENERATE_SOURCEMAP=false\" && npm run build

this answer helped me: How to set environment variable in React JS..?

Upvotes: 14

jsnewbie
jsnewbie

Reputation: 1819

You have to create a .env file in your root directory (same folder as package.json) and set GENERATE_SOURCEMAP=false on a single line.

for additional configurations, you may refer to the documentation here: https://facebook.github.io/create-react-app/docs/advanced-configuration

Upvotes: 73

Phoenix
Phoenix

Reputation: 445

Solution for ejected create-react-app v2.1.3.

Go to /config/webpack.config.js directory and change the following line:

const shouldUseSourceMap = process.env.GENERATE_SOURCEMAP !== 'false';

To:

const shouldUseSourceMap = false;

And Bob is your uncle.

Upvotes: 3

Krupal Patel
Krupal Patel

Reputation: 602

This works for me. Hope it helps anyone.

// package.json

"build": "react-scripts build",
"postbuild": "rimraf build/**/*.map"

This way, it will auto delete map files during build generation.

Upvotes: 9

Related Questions