webpack -- mode挖坑

一、配置环境类型

通过配置mode来告诉webpack当前运行的环境

mode有三个选项，none，production(生产环境)，development(开发环境)

二、配置环境(必须，特殊)

配置mode，必须在webpack的内置插件里面配置一下环境

const webpack = require('webpack')

plugins: [
    new webpack.DefinePlugin({
        "process.env.NODE_ENV": JSON.stringify('production/development')
    })
]

三、判断环境

全局可以通过process.env.NODE_ENV来获取当前运行环境

四、设置运行环境

1、package.json

如果在webpack里面没有配置mode，同样可以在cli命令里面传递

{
    "dev": "webpack-dev-server --mode=development --config",
    "build": "webpack --mode=production --config"
}

2、package.json

这个是根据大佬教程来配置，需要安装模块

npm install cross-env --save-dev

之后配置环境

{
    "dev": "cross-env NODE_ENV=development webpack-dev-server --config",
    "build": "cross-env NODE_ENV=production webpack --config"
}