2020-vue疑难杂症-vue 中项目打包由于console.log导致打包不

终于做完项目过后,想要打包,我去。。。。打包不了,一直报错

image.png
  • 您们看看是不是这样子的错误,我心都要崩溃了,但是没关系,2019年-6月份刚刚学了这个,但是那个时候是vue-cli的可视化操作,我现在不用可视化,怎么操作呢??????


    image.png

来看看我们怎么操作::!!! 前方高能

    1. 第一步:首先要在项目的根目录下创建我们的一个文件:vue.config.js: 如下:
      image.png
  • 2.然后就在vue.config.js 下开始配置,在配置前,我们需要先下载uglifyjs-webpack-plugin

// 1. 首先第一步:肯定是需要下载安装插件呀:yarn add  -D uglifyjs-webpack-plugin
const UglifyJsPlugin = require("uglifyjs-webpack-plugin")
configureWebpack: config => {
  config.plugins.push(
    new UglifyJsPlugin({
      uglifyOptions: {
        compress: {
          drop_console: true, // 打包时自动删除 console 语句
          drop_debugger: true // 打包时自动删除 debugger 语句
        },
        warnings: false,
        output: {
          comments: false // 去掉注释内容
        }
      },
      sourceMap: false, // 该选项应与 productionSourceMap 的设置相同
      parallel: true
    })
  )
}

按照以前的步骤搞定之后:我们就需要重启项目:然后就yran build

image.png

然后我们看看项目是否有我们的dist文件

image.png

搞定,下班!!!!

你可能感兴趣的:(2020-vue疑难杂症-vue 中项目打包由于console.log导致打包不)