【Vite+Ts】打包使用js混淆加密_vite代码混淆，2024年最新农民工看完都学会了

在Vite项目中使用JavaScript混淆器，可以通过UglifyJS或Terser插件进行代码混淆。以下是使用Terser插件进行代码混淆的步骤：

1. 安装terser插件：

npm install terser-webpack-plugin --save-dev

2. 在vite.config.js中配置插件：

import { defineConfig } from 'vite';
import { terser } from 'rollup-plugin-terser';
 
export default defineConfig({
  plugins: [
    terser({
      compress: {
        // 混淆时，不重命名函数和变量
        keep_fnames: true,
        // 混淆时，不重命名属性和类名
        keep_classnames: true,
      },
      output: {
        // 移除注释内容
        comments: false,
      },
    }),
  ],
  build: {
    // 配置minify选项，使用terser插件进行代码混淆
    minify: 'terser',
  },
});

3. 运行构建命令：

npm run build

这样，在构建过程中，Vite会使用Terser插件进行代码混淆压缩，从而保护源代码不被轻易阅读。注意，混淆会改变代码结构，可能会导致某些依赖于特定代码结构的功能失效，因此需要适当调整terser插件的配置，以确保关键功能正常工作。