vue-cli3.0配置process.env.NODE_ENV

  1. 在根目錄下新建三個.env文件
    在這裏插入圖片描述
NODE_ENV=dev
VUE_APP_URL=http://192.168.14.22

NODE_ENV=prod
VUE_APP_URL=https://www.baidu.com

NODE_ENV=test
VUE_APP_URL=https://test.baidu.com

分別對應以上三個文件本地環境正式環境測試環境

  1. vue.config.js文件中配置相應的變量,不同的環境打包進不同的文件夾。(此操作可不寫
module.exports = {
    lintOnSave: false,
    outputDir: `dist-${process.env.NODE_ENV}`
}
  1. package-lock.json文件中的script標籤中添加
scripts": {
    "serve": "vue-cli-service serve --mode dev",
    "build.test": "vue-cli-service build --mode test",
    "build": "vue-cli-service build --mode prod"
  },

驗證************************************
main.jsconsole.log(process.env.VUE_APP_URL) 去控制檯看結果

npm run build.testyarn build.test 命令打包查看生成的文件名 分別查看控制檯的打印結果

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章