1

有没有办法彻底破坏vue捆绑的组件webpack？

terser-webpack-plugin当通过mangle.propertiesset to应用重整时true，并非所有属性名称都被重整，例如：

location: {
  lng: -.134281,
  lat:51.513508,
  zoom:13,
  pitch:1,
  bearing:60
}

变成

location:{
  k:-.134281,
  M:51.513508,
  zoom:13,
  pitch:1,
  V:60
}

编辑

根据要求：Webpack 配置文件的相关部分，在这种情况下是手动添加项目的默认vie-cli配置：mangle.properties

minimizer: [
      {
        options: {
          test: /\.m?js(\?.*)?$/i,
          chunkFilter: () => true,
          warningsFilter: () => true,
          extractComments: false,
          sourceMap: false,
          cache: true,
          cacheKeys: defaultCacheKeys => defaultCacheKeys,
          parallel: true,
          include: undefined,
          exclude: undefined,
          minify: undefined,
          terserOptions: {
            output: {
              comments: /^\**!|@preserve|@license|@cc_on/i
            },
            compress: {
              arrows: false,
              collapse_vars: false,
              comparisons: false,
              computed_props: false,
              hoist_funs: false,
              hoist_props: false,
              hoist_vars: false,
              inline: false,
              loops: false,
              negate_iife: false,
              properties: false,
              reduce_funcs: false,
              reduce_vars: false,
              switches: false,
              toplevel: false,
              typeofs: false,
              booleans: true,
              if_return: true,
              sequences: true,
              unused: true,
              conditionals: true,
              dead_code: true,
              evaluate: true
            },
            mangle: {
              safari10: true,
              properties: true
            }
          }
        }
      }
    ],
4

1 回答 1

4

这两个属性 ( zoom, pitch) 恰好包含在reserved名称列表中，看看domprops.jsonUglifyJS 在修改期间内部使用的这个默认文件。

提供了一个默认排除文件，tools/domprops.json其中应涵盖各种浏览器中定义的大多数标准 JS 和 DOM 属性。通过--mangle-propsdomprops 禁用此功能

如果您想保留此默认列表，您可以在插件的自定义缩小选项中执行以下任何操作：

  1. 创建您的自定义保留名称列表，
  2. 加载默认列表 ( domprops.json) 并传入一个函数/过滤器以删除那些不需要的名称，
  3. 如果您确定没有名称冲突，只需合并这两个文件。

webpack.config.js

{
  optimization: {
    minimizer: [
      new TerserPlugin({
        minify(file, sourceMap) {
          const uglifyJsOptions = {
            mangle: {
              properties: {
                reserved: require('your_custom_list')
              }

              // Or filter them

              properties: {
                reserved: require('uglify-js/tools/domprops.json')
                  .filter(name => ![
                    'zoom',
                    'pitch'
                  ]
                  .includes(name))
              }
            }
          };

          return require('uglify-js').minify(file, uglifyJsOptions);
        },
      }),
    ],
  },
}

mangle.reserved另外，请注意执行此操作之间和同时执行此操作时的相似之处mangle.properties.reserved，因为后者可能是您需要的。查看缩小选项结构。

于 2019-02-13T02:19:54.603 回答