Sreeram Nair
Sreeram Nair

Reputation: 2387

How can I hide code from the Edge browser in React?

I have developed a dummy React application using create-react-app.

Stackbliz Reference

I know that when we do npm run build a build is created and there are map files included in the build. The map file maps between the transpiled JavaScript file and the original source file.

So I tried deleting the map file and it didn't work. Also, I feel this is not the right way. So I wanted to know how to hide the code from the browser in Dev Server.

Enter image description here

I tried using the package.json with GENERATE_SOURCEMAP=false, but it still didn't do the trick.

Upvotes: 0

Views: 489

Answers (3)

noszone
noszone

Reputation: 312

Create a file .env.production in your project directory (where package.json is located).

Then put in there:

GENERATE_SOURCEMAP=TRUE

Anorher way is package.json file:

    scripts: {
      "build": "GENERATE_SOURCEMAP=false react-scripts build"
    }

And third is a command line use:

GENERATE_SOURCEMAP=false react-scripts build

I recommend using .env.production file.

Upvotes: 3

Jay
Jay

Reputation: 384

GENERATE_SOURCEMAP=false this will hide your code in browser

"build": "GENERATE_SOURCEMAP=false env-cmd -f .env.production react-scripts build",

for production use env name .env.production

for dev use env name .env.development and command to run build npm run build:dev

 "build:dev": "GENERATE_SOURCEMAP=false env-cmd -f .env.development react-scripts build",
  • if you have same env for all environment or don't have env remove .env.production and .env.development from script

BEFORE ----- before GENERATE_SOURCEMAP=false

AFTER ----- AFTER GENERATE_SOURCEMAP=false

Upvotes: 1

Aayush Garg
Aayush Garg

Reputation: 69

For GENERATE_SOURCEMAP=false you can try creating a .env file and put it in that or you can try running GENERATE_SOURCEMAP=false npm start or GENERATE_SOURCEMAP=false npm run build

Upvotes: 5

Related Questions