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"
}