1. 描述

使用vue-cli编写的插件或库文件,打包的时候如果需要压缩、混淆、去注释,去除debugger、console.log等,可以使用 uglifyjs-webpack-plugin 或者 terser-webpack-plugin,前者不支持es6,打包时可能会报Unexpected token的错误,后者是前者对es6的支持版本。

2. uglifyjs-webpack-plugin

2.1 github

2.2 安装

npm install uglifyjs-webpack-plugin --save-dev

2.3 配置

在vue.config.js中配置

const UglifyJsPlugin = require('uglifyjs-webpack-plugin')

// module.exports 中配置,可加参数,详见github文档或百度
configureWebpack: config => {
  if (process.env.NODE_ENV === 'production') {
    config.plugins.push(new UglifyJsPlugin())
  }
}

3. terser-webpack-plugin

2.1 github

2.2 安装

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

2.3 配置

在vue.config.js中配置

const TerserPlugin = require('terser-webpack-plugin')

// module.exports 中配置,可加参数,详见github文档或百度
configureWebpack: config => {
  if (process.env.NODE_ENV === 'production') {
    config.plugins.push(new TerserPlugin())
  }
}
Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐