Webpack Obfuscator 插件使用指南

Webpack Obfuscator 插件使用指南

【免费下载链接】webpack-obfuscator 项目地址: https://gitcode.com/gh_mirrors/we/webpack-obfuscator

项目介绍

Webpack Obfuscator 是一个专为 Webpack 5 设计的 JavaScript 代码混淆插件。该插件基于 javascript-obfuscator 库开发，能够通过多种混淆技术保护你的源代码不被轻易反编译和阅读，为你的知识产权提供专业级的安全防护。

核心技术栈

该项目主要使用 TypeScript 和 JavaScript 进行开发，依赖于以下关键技术：

• Webpack 5 - 现代前端构建工具
• javascript-obfuscator - 核心混淆引擎
• loader-utils - Webpack 加载器工具库
• multi-stage-sourcemap - 多阶段源码映射处理
• multimatch - 多模式匹配库
• webpack-sources - Webpack 资源管理

安装步骤

环境要求

在安装之前，请确保你的开发环境已满足以下要求：

• Node.js 运行环境
• npm 包管理器
• Webpack 5 构建工具

安装命令

npm install --save-dev javascript-obfuscator webpack-obfuscator

配置方法

插件配置方式

在 Webpack 配置文件中添加插件：

const WebpackObfuscator = require('webpack-obfuscator');

module.exports = {
  plugins: [
    new WebpackObfuscator({
      rotateStringArray: true,
      disableConsoleOutput: false,
      sourceMap: true
    }, ['排除的文件.js'])
  ]
};

加载器配置方式

在 Webpack 配置文件中添加加载器规则：

const WebpackObfuscator = require('webpack-obfuscator');

module.exports = {
  module: {
    rules: [
      {
        test: /\.js$/,
        enforce: 'post',
        exclude: [ 
          path.resolve(__dirname, '排除的文件.js') 
        ],
        use: { 
          loader: WebpackObfuscator.loader, 
          options: {
            rotateStringArray: true,
            stringArray: true,
            stringArrayThreshold: 1
          }
        }
      }
    ]
  }
};

配置参数详解

obfuscatorOptions

类型：Object 默认值：null

javascript-obfuscator 的配置选项，支持所有标准混淆参数。

excludes（仅插件）

类型：Array 或 String 默认值：[]

用于指定不需要混淆的文件列表。支持 multimatch 包的多模式匹配语法。

常用混淆选项

• rotateStringArray - 旋转字符串数组增强混淆
• disableConsoleOutput - 禁用控制台输出
• sourceMap - 生成源码映射
• stringArray - 启用字符串数组混淆
• stringArrayThreshold - 字符串数组阈值设置

使用示例

多入口配置示例

const JavaScriptObfuscator = require('webpack-obfuscator');

module.exports = {
  entry: {
    'abc': './test/input/index.js',
    'cde': './test/input/index1.js'
  },
  output: {
    path: 'dist',
    filename: '[name].js'
  },
  plugins: [
    new JavaScriptObfuscator({
      rotateStringArray: true
    }, ['abc.js'])
  ]
};

构建执行

配置完成后，使用以下命令执行构建：

npx webpack

或者使用项目提供的测试命令：

npm run test:plugin    # 测试插件功能
npm run test:loader    # 测试加载器功能

项目结构

项目采用模块化设计，主要包含以下核心模块：

• index.ts - 主入口文件
• loader/ - 加载器实现
• plugin/ - 插件实现
• test/ - 测试用例和配置
• declarations/ - TypeScript 类型声明

通过合理配置 Webpack Obfuscator，你可以有效保护 JavaScript 代码的安全性，防止源代码被恶意分析和盗用。

【免费下载链接】webpack-obfuscator 项目地址: https://gitcode.com/gh_mirrors/we/webpack-obfuscator