Javascript Question posted in
A very good W3school tutorial can be found here.

How to hide JavaScript files from the Chrome Developer Tools, in Next.js?

I have a Next.js project. My concern is, the utils/components are easily visible throught the Chrome Developer Tools, as can be seen here:

enter image description here

How can I hide them? More importantly, is it safe to have them easily accessible?

Tags:

2

Answers


  1. 0

    It is not practical to hide JavaScript files from the developer tools if you are serving a client-side rendered application. By nature, JavaScript is executed on the client’s browser, and the files need to be accessible for the application to run.
    You can, however, disable source maps for your production build. This will make it harder (but not impossible) to read the code, as it won’t be formatted or mapped to the original source. However, keep in mind that the code will still be visible; it will just be minified and harder to follow

    // next.config.js

module.exports = {
  productionBrowserSourceMaps: false,
  // other configurations...
};
    Login or Signup to reply.
  2. 0

    You should probably learn about minimization and obfuscation.
    This will not completely hide your code, but it will make it hard to read.

    There are a lot of different tools for this, just make sure the one you use, is compatible with the version of Javascript you are using, much likely ES6+.

    You can learn about Javascript obfuscation on this page:
    Javascript Obfuscation Tool

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search