Vue混淆最佳做法

Question

你好，有开发社区。 我正在尝试使用（https://github.com/javascript-obfuscator/webpack-obfuscator）webpack-obfuscator

来混淆Vue应用程序

vue.config.js

configureWebpack: {
    plugins: [
      new JavaScriptObfuscator({})
    ],

但是chrome控制台的输出显示很多错误，并且应用程序损坏了（甚至根本不显示登录页面）

我还尝试了（https://github.com/javascript-obfuscator/obfuscator-loader）的以下构建配置->

vue.config.js

const obfuscatorOptions = {
  compact: true,
  controlFlowFlattening: false,
  controlFlowFlatteningThreshold: 0.75,
  deadCodeInjection: true,
  deadCodeInjectionThreshold: 0.4,
  debugProtection: true,
  debugProtectionInterval: true,
  disableConsoleOutput: true,
  domainLock: [],
  identifierNamesGenerator: 'hexadecimal',
  identifiersPrefix: '',
  inputFileName: '',
  log: false,
  renameGlobals: true,
  reservedNames: [],
  reservedStrings: [],
  rotateStringArray: true,
  seed: 0,
  selfDefending: true,
  sourceMap: false,
  sourceMapBaseUrl: '',
  sourceMapFileName: '',
  sourceMapMode: 'separate',
  stringArray: true,
  stringArrayEncoding: true,
  stringArrayThreshold: 0.75,
  target: 'browser',
  transformObjectKeys: true,
  unicodeEscapeSequence: false
}

module: {
      rules: [
        {
          test: /\.js$/,
          include: [ path.resolve(__dirname, "./src") ],
          enforce: 'post',
          use: { loader: 'obfuscator-loader', options: obfuscatorOptions }
        },
      ]
    }

但是控制台会显示以下错误

Uncaught Error: Module build failed (from ./node_modules/obfuscator-loader/lib/index.js):
Error: Cannot apply @injectable decorator multiple times.
    at E:\downloads\whats-app-sender-dashboard\coreui-free-vue-admin-template-master\node_modules\inversify\lib\annotation\injectable.js:8:19
    at DecorateConstructor (E:\downloads\whats-app-sender-dashboard\coreui-free-vue-admin-template-master\node_modules\reflect-metadata\Reflect.ts:1202:35)
    at Object.decorate (E:\downloads\whats-app-sender-dashboard\coreui-free-vue-admin-template-master\node_modules\reflect-metadata\Reflect.ts:742:24)
    at _decorate (E:\downloads\whats-app-sender-dashboard\coreui-free-vue-admin-template-master\node_modules\inversify\lib\annotation\decorator_utils.js:42:13)
    at Object.decorate (E:\downloads\whats-app-sender-dashboard\coreui-free-vue-admin-template-master\node_modules\inversify\lib\annotation\decorator_utils.js:55:9)
    at Object.<anonymous> (E:\downloads\whats-app-sender-dashboard\coreui-free-vue-admin-template-master\node_modules\javascript-obfuscator\dist\webpack:\JavaScriptObfuscator\src\event-emitters\ObfuscationEventEmitter.ts:7:9)
    at r (E:\downloads\whats-app-sender-dashboard\coreui-free-vue-admin-template-master\node_modules\javascript-obfuscator\dist\webpack:\JavaScriptObfuscator\webpack\bootstrap:22:1)
    at Object.<anonymous> (E:\downloads\whats-app-sender-dashboard\coreui-free-vue-admin-template-master\node_modules\javascript-obfuscator\dist\webpack:\JavaScriptObfuscator\src\container\InversifyContainerFacade.ts:30:1)
    at r (E:\downloads\whats-app-sender-dashboard\coreui-free-vue-admin-template-master\node_modules\javascript-obfuscator\dist\webpack:\JavaScriptObfuscator\webpack\bootstrap:22:1)
    at Object.<anonymous> (E:\downloads\whats-app-sender-dashboard\coreui-free-vue-admin-template-master\node_modules\javascript-obfuscator\dist\webpack:\JavaScriptObfuscator\src\JavaScriptObfuscatorFacade.ts:11:1)
    at r (E:\downloads\whats-app-sender-dashboard\coreui-free-vue-admin-template-master\node_modules\javascript-obfuscator\dist\webpack:\JavaScriptObfuscator\webpack\bootstrap:22:1)
    at Object.<anonymous> (E:\downloads\whats-app-sender-dashboard\coreui-free-vue-admin-template-master\node_modules\javascript-obfuscator\dist\webpack:\JavaScriptObfuscator\index.ts:3:1)
    at r (E:\downloads\whats-app-sender-dashboard\coreui-free-vue-admin-template-master\node_modules\javascript-obfuscator\dist\webpack:\JavaScriptObfuscator\webpack\bootstrap:22:1)
    at E:\downloads\whats-app-sender-dashboard\coreui-free-vue-admin-template-master\node_modules\javascript-obfuscator\dist\webpack:\JavaScriptObfuscator\webpack\bootstrap:74:1
    at Object.<anonymous> (E:\downloads\whats-app-sender-dashboard\coreui-free-vue-admin-template-master\node_modules\javascript-obfuscator\dist\webpack:\JavaScriptObfuscator\webpack\bootstrap:74:1)
    at Module._compile (internal/modules/cjs/loader.js:774:30)
    at eval (webpack-internal:///./src/main.js:1:7)
    at Object../src/main.js (http://127.0.0.1:8080/app.js:1197:1)
    at __webpack_require__ (http://127.0.0.1:8080/app.js:724:30)
    at fn (http://127.0.0.1:8080/app.js:101:20)
    at Object.1 (http://127.0.0.1:8080/app.js:1211:18)
    at __webpack_require__ (http://127.0.0.1:8080/app.js:724:30)
    at http://127.0.0.1:8080/app.js:791:37
    at http://127.0.0.1:8080/app.js:794:10

那么，如何成功混淆vue应用？

Answer 1

更新

我目前正在使用以下设置，以期从使用TerserPlugin的vue应用程序的构建过程中丑化js代码的预期结果

vue.config.js文件

from django.urls import re_path

urlpatterns = [
    re_path('api/end-point/?$', api.endPointView),
    ...

结果是代码混淆得很好：

但是仍然可以看到Vue应用实例的选项