1.在根目录添加开发环境.env.development
# 本地环境
NODE_ENV = development
VUE_APP_NUXT_API_URL = /api
NUXT_BASE_PORT = 3000
NUXT_BASE_LINK = http://192.168.21.80:6000
NUXT_SYSTEM_TITLE = xx管理系统
2.在根目录添加测试环境.env.test
# 测试环境
NODE_ENV = test
NUXT_API_URL = /official
NUXT_BASE_PORT = 3000
NUXT_BASE_LINK = http://192.168.21.80:6000
NUXT_SYSTEM_TITLE = xx管理系统
3.在根目录添加正式环境.env.production
# 生产环境
NODE_ENV = production
NUXT_API_URL = /official
NUXT_BASE_LINK = http://www.xxxx.com:6000
NUXT_BASE_PORT = 3000
NUXT_SYSTEM_TITLE = xx管理系统
4.在nuxt.config.ts中配置环境变量中的变量信息
export default defineNuxtConfig({
devtools: { enabled: true },
// 引入全局样式
css: [
"@/assets/style/main.css"
],
runtimeConfig: {
// 仅在服务器端可用的私钥
baseUrl: '/official',
// 公共中的密钥也将公开给客户端
public: {
apiUrl: process.env.NUXT_API_URL,
baseLink: process.env.NUXT_BASE_LINK
}
},
nitro: {
devProxy: {
"/api": {
target: 'http://192.168.21.80:6000/official',
prependPath: true,
changeOrigin: true,
}
},
// 该配置用于服务端请求转发
routeRules: {
'/api/**': {
proxy: 'http://192.168.21.80:6000/official/**'
}
}
}
})
5.配置package.json文件
使用 --dotenv指定环境
官网参考链接:https://nuxt.com/docs/api/commands/build
{
"scripts": {
"dev": "nuxt dev",
"dev-test": "nuxt dev --dotenv .env.test",
"dev-prod": "nuxt dev --dotenv .env.production",
"build": "nuxt build",
"build-test": "nuxt build --dotenv .env.test",
"build-prod": "nuxt build --dotenv .env.production",
"generate": "nuxt generate",
"preview": "nuxt preview",
"postinstall": "nuxt prepare"
}
}
OK,配置完成~~~~~~