企业网站建设安阳,江阴市住房和城乡建设局网站,河南建设工程信息网下载,自媒体十大平台目录 创建配置文件
.env.development 文件
.env.production 文件
.env.dev 文件
使用变量
配置 package.json 文件
例子#xff1a;在 api.js 使用
可以继续添加 创建配置文件 在根目录与 package.json 同级创建文件 .env.development、 .env.production、.env.dev 文件…目录 创建配置文件
.env.development 文件
.env.production 文件
.env.dev 文件
使用变量
配置 package.json 文件
例子在 api.js 使用
可以继续添加 创建配置文件 在根目录与 package.json 同级创建文件 .env.development、 .env.production、.env.dev 文件说明.env.development默认开发环境下的配置文件.env.production默认生产环境下的配置文件.env.dev自定义本地测试用如果没有这些文件 那么运行 npm run serve 时process.env.NODE_ENV 的值默认就是 development 运行 npm run build 时process.env.NODE_ENV 的值默认就是 production .env.development 文件
VUE_APP_URL http://127.0.0.1:8081/api/
VUE_APP_LOOK_URL http://127.0.0.1:8082/api1/
.env.production 文件
VUE_APP_URL http://168.168.152.9:8081/api/
VUE_APP_LOOK_URL http://168.168.152.9:8082/api1/
.env.dev 文件
NODE_ENV production
VUE_APP_URL http://192.168.0.1:8081/api/
VUE_APP_LOOK_URL http://192.168.0.1:8082/api1/
使用变量
配置 package.json 文件
{name: my_project,version: 0.1.0,private: true,scripts: {serve: vue-cli-service serve, // 默认就是 development 开发环境build: vue-cli-service build, // 默认就是 production 开发环境dev: vue-cli-service build --mode dev // 自定义配置 .env.dev},dependencies: {axios: ^1.2.1,core-js: ^3.8.3,element-ui: ^2.15.12,vue: ^2.6.14,vue-router: ^3.5.1},devDependencies: {vue/cli-plugin-babel: ~5.0.0,vue/cli-plugin-router: ~5.0.0,vue/cli-service: ~5.0.0,less: ^4.1.3,less-loader: ^11.1.0,vue-template-compiler: ^2.6.14}
} 这边 --mode 后面的 dev 要对应 .env.dev 后面的 dev 命名如果对应不上 vue-cli-service serve 就会默认 developmentvue-cli-service build 就会默认 production 例子在 api.js 使用
import Vue from vue
import axios from axios// 启动什么环境就调用对应的配置变量
let url process.env.VUE_APP_URL
Vue.prototype.$look_url process.env.VUE_APP_LOOK_URLconst reqs axios.create({baseURL: url,headers: { [Content-Type]: application/x-www-form-urlencoded }
})
// 请求拦截器
reqs.interceptors.request.use((req) {return req},(err) {return Promise.reject(err)}
)
// 响应拦截器
reqs.interceptors.response.use((res) {return res},(err) {return Promise.reject(err)}
)
export default reqs可以继续添加
1、创建文件 .env.test 2、配置 package.json 3、在 hello.vue 文件调用
templatedivh1现在{{ msg }}环境/h1/div
/templatescript
export default {data() {return {msg: process.env.NODE_ENV development ? 开发 : 生产}},mounted() {if (process.env.NODE_ENV development) {console.log(开发)} else if (process.env.NODE_ENV production) {console.log(生产)} else if (process.env.NODE_ENV test) {console.log(测试)}}
}
/scriptstyle scoped
/style注意 自定义变量名必须以 VUE_APP_ 开头例如VUE_APP_URL、VUE_APP_TEST 参考vue配置环境变量可验证、步骤详细_一颗小芹菜的日常的博客-CSDN博客
