移除console语句
- 上线之后不再需要console语句,使用build命令打包时,需要将console语句进行删除,**使用命令下载babel的一个插件,
npm install babel-plugin-transform-remove-console --save-dev
- 然后在项目的根目录下的babel.config.js文件中配置
module.exports = {
presets: [
'@vue/cli-plugin-babel/preset'
],
plugins: [...prodPlugins]
}
- 虽然这种方法执行命令就会移除掉,但是在开发阶段运行npm run serve命令时也会移除,所以就应该判断一下是开发环境还是生产环境,修改一下babel.config.js的配置
const prodPlugins = []
if (process.env.NODE_ENV === 'production') {
prodPlugins.push('transform-remove-console')
}
开发环境和部署环境
项目开发阶段和生成环境可能不一样,开发阶段配置也会比较随意 ,等到上线之后再进行手动修改既繁琐又麻烦还很容易出错。
解决方法:使用两个入口文件,一个 用于开发环境,另一个用于生产环境
1. 创建入口文件
在 src 目录下新建 prod_env.js 和 dev_env.js
将main.js 中代码分别拷贝到这两个文件中,并删除 main.js
2. 配置打包时的入口文件
项目根目录下新建 vue.config.js
编写以下代码
module.exports={
chainWebpack:config=>{
config.when(process.env.NODE_ENV === 'production',config=>{
config.entry('app').clear().add('./src/prod_env.js'