vue 打包时去掉注释

前言

打包的代码肯定是要去掉注释的，不然后台有人查代码，翻数据就很烦，但是我们写这么多代码还有写代码时的注释肯定不能一行一行的去删除掉，这样太麻烦了，这次分享打包的时候就去掉注释，这个本来是和打包时es6转es5代码一起使用的，但是考虑到有些不需要代码转换，就没写在一个博客里，有需要打包代码转换的可以看我的另一篇文章。

点击跳转：vue打包时将es6转成es5

一，安装 terser-webpack-plugin 插件：

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

二，在 vue.config.js 中配置 terser-webpack-plugin：

在项目根目录下的 vue.config.js 文件中，添加 terser-webpack-plugin 插件的配置。

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

module.exports = {
  configureWebpack: {
    optimization: {
      minimizer: [
        new TerserPlugin({
          terserOptions: {
            format: {
              comments: false, // 去除注释
            },
          },
        }),
      ],
    },
  },
};

三，重新打包项目：

npm run build 或其他打包命令时，Vue CLI 将会使用配置的 terser-webpack-plugin 插件来压缩 JavaScript 代码，并在其中去除注释。