前幾天ts+vue3.0+view-design擼了一個項目,然後總感覺哪裏不對勁,今天終於醒悟了原來是熱更新沒開
在vue.config.js中配置以下選項
const IS_PRO = ['production', 'test'].includes(process.env.NODE_ENV);
css: {
// 是否使用css分離插件 ExtractTextPlugin
extract: IS_PRO,
// 開啓 CSS source maps 打包時不生成.map文件?
sourceMap: false,
// css預設器配置項
loaderOptions: {
},
// 爲所有的 CSS 及其預處理文件開啓 CSS Modules。
// 這個選項不會影響 `*.vue` 文件。
requireModuleExtension: true
},
上文中用到了process.env環境變量,那麼這裏在安利一個知識點吧
package.json
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"build:dev": "vue-cli-service build --mode development",
"lint": "vue-cli-service lint"
},
環境變量存放地址
優先級.env<.env.any<.env.any.local (.local文件會被 git 忽略)
npm run serve 會默認找到.env.development文件配置
npm run build會默認找到.env.production文件配置
當然我們可以把本地的配置放置在.local內用於本地配置,然後對應的線上和測試環境放置不同的文件,打包上線時 對應的 npm run build --文件名稱就行了比如npm run build --development