nuxt 多环境配置

1,135 阅读1分钟

1.安装 cross-env

npm install cross-env 
yarn add cross-env 

2.根目录新建env.js文件

module.exports = {
  // 开发环境
  dev: {
    NODE_ENV: 'dev',
    BASE_URL: 'http://192.168.50.192:8080', // 开发服务器地址
  },
  // 测试环境
  test: {
    NODE_ENV: 'test',
    BASE_URL: '', // 测试服务器地址
  },
  // 生产环境
  pro: {
    NODE_ENV: 'production',
    BASE_URL: '', // 正式服务器地址
  },
}

  1. 更改nuxt.config.js
import env from './env' // 环境配置文件
export default {
    env: {
        BASE_URL: env[process.env.NODE_ENV].BASE_URL,
        NODE_ENV: env[process.env.NODE_ENV].NODE_ENV,
      },
}
  1. 更改package.json dev/test/build
"scripts": {
    "dev": "cross-env NODE_ENV=dev nuxt",
    "test": "cross-env NODE_ENV=test nuxt",
    "build": "cross-env NODE_ENV=pro nuxt build",
    "start": "nuxt start",
    "generate": "nuxt generate",
    "lint:prettier": "prettier --check .",
    "lint": "yarn lint:prettier",
    "lintfix": "prettier --write --list-different ."
}

重新启动 yarn run dev, 打印出来

process.env.NODE_ENV = "dev" 
process.env.BASE_URL = "http://192.168.50.192:8080"