The nextjs-obfuscator
enables you to make your Next.js app difficult to be reverse-engineered, using javascript-obfuscator.
ℹ️ If you are looking for README for v1, see here.
There are some useful notes:
- The app router is supported.
- Building by turbopack is currently NOT supported.
- Minimum supported Next.js version is v13.
You have to install javascript-obfuscator separately.
On npm:
npm i -D javascript-obfuscator nextjs-obfuscator
On yarn:
yarn add -D javascript-obfuscator nextjs-obfuscator
Wrap your configuration in your next.config.js
to use this plugin, for example:
const withNextJsObfuscator = require("nextjs-obfuscator")(obfuscatorOptions, pluginOptions);
/** @type {import('next').NextConfig} */
const nextConfig = withNextJsObfuscator({
// ... your next.js configuration
});
module.exports = nextConfig;
If you use some other plugins, we recommend applying this plugin later than any other ones because in most cases the obfuscation will change a large portion of the code.
require("nextjs-obfuscator")(obfuscatorOptions, pluginOptions)
Type: Object
(required)
This is the options of javascript-obfuscator, but there are some important notes:
-
disableConsoleOutput
should be set tofalse
and you can easily notice the error logging by React on console. If they are present, they indicate your app has been broken. -
There are some options that MUST NOT be set:
These options will be set by the nextjs-obfuscator plugin internally if necessary.
Type: Object
(optional)
More options for this plugin. All properties are optional.
{
enabled: boolean | "detect",
patterns: string[],
obfuscateFiles: Partial<{
buildManifest: boolean,
ssgManifest: boolean,
webpack: boolean,
additionalModules: string[],
}>,
log: boolean,
};
Option | Type | Default Value | Description |
---|---|---|---|
enabled |
boolean | "detect" |
"detect" |
Indicates if the plugin is enabled or not. If "detect" specified, the plugin will be enabled only when building for production. |
patterns |
string[] |
["./**/*.(js|jsx|ts|tsx)"] |
Glob patterns to determine which files to be obfuscated. They must be relative paths from the directory where next.config.js is placed. |
obfuscateFiles |
object |
Additional files to be obfuscated. | |
obfuscateFiles.buildManifest |
boolean |
false |
If set to true, the plugin will obfuscate _buildManifest.js |
obfuscateFiles.ssgManifest |
boolean |
false |
If set to true, the plugin will obfuscate _ssgManifest.js |
obfuscateFiles.webpack |
boolean |
false |
If set to true, the plugin will obfuscate webpack.js , which is an entry point. |
obfuscateFiles.additionalModules |
string[] |
[] |
Names of additional external modules to be obfuscated. Convenient if you are using custom npm package, for instance. Use like ["module-a", "module-b", ...] . |
log |
boolean |
false |
If set to true, the plugin will use console.log as logger. Otherwise, it uses webpack's standard logger. |
- This plugin inserts a custom loader to obfuscate project files and external modules.
- This plugin inserts a custom plugin to obfuscate
buildManifest
,ssgManifest
,webpack
assets.
Using this plugin can break your next.js app, so you have to check carefully your app works fine.