前端开发、测试、生产等环境配置

项目开发测试等环境的配置

1、项目下新建几个文件

.env.development

NODE_ENV = 'development'
VUE_APP_MODE = 'development'
VUE_APP_API_URL = 'http://192.168.1.33:8002/api/'

.env.test

NODE_ENV = 'test'
VUE_APP_MODE = 'test'
VUE_APP_API_URL = 'http://192.168.10.20:8008/api/'

.env.production

NODE_ENV = 'production'
VUE_APP_MODE = 'production'
VUE_APP_API_URL = 'http://192.168.10.20:80010/api/'

2、修改vue.config.js里的api端口写法

//process是默认的全局变量
proxy: {
      '/api': {
        target: process.env.VUE_APP_API_URL,
        changeOrigin: true,
      },
    },

3、修改package.json里的启动命令
 

  "scripts": {
    "dev": "vue-cli-service serve --mode development",
    "test": "vue-cli-service serve --mode test",
    "pro": "vue-cli-service serve --mode production",
    "build:dev": "vue-cli-service build --mode development",
    "build:test": "vue-cli-service build --mode test",
    "build:pro": "vue-cli-service build --mode production",
  },

4、执行启动或者打包命令

yarn dev / npm run dev
yarn test / npm run test

...略

1）、开发环境

2）、测试环境