vue全局变量的配置

一、vue 全局变量(vue 全局变量又是需要单独设置请求路径的前缀，但又要根据当前环境是开发环境还是生产环境动态匹配，那么就用这种方法）

.env 在所有的环境中被载入
.env.local 在所有的环境中被载入，但会被 git 忽略
.env.[mode] 只在指定的模式中被载入
.env.[mode].local 只在指定的模式中被载入，但会被 git 忽略

注意：
1.其中以.local结尾的文件会被忽略，
2.[mode]可以是：development（开发）、production（生产）、test（测试），他们分别代表不同的环境模式
3.NODE_ENV，BASE_URL 是默认的环境变量可访问无法被修改，NODE_ENV代表当前的环境模式，BASE_URL代表的是当前根路径
4.自定义环境变量规则：必须以 VUE_APP_ 开头否则无效
5.访问方式：在开发中通过 process.env.变量名称的方式获取变量值
6.修改完需要重启服务才生效
7.不可用来存储非公开信息，因为webpack编译后会被暴露

取值也不用在main.js中设置什么，在需要用的地方直接取值就行

二、自定义全局变量

src/utils/config.js 新建js文件，内容如下

//定义全局变量
const videoPreUrl = '/dev-api'export {videoPreUrl
}

main.js中

import { videoPreUrl } from '@/utils/config.js';
// 全局方法挂载
Vue.prototype.videoPreUrl = videoPreUrl

在需要用的地方直接取值就行

console.log( this.videoPreUrl )

参考博文，也是讲全局变量

vue全局变量的配置相关推荐

一字一句的搞懂vue-cli之vue webpack template配置
webpack--神一样的存在.无论写了多少次,再次相见,仍是初见.有的时候开发vue项目,对尤大的vue-cli感激涕零.但是,但是,但是...不是自己的东西,真的很不想折腾.所以,我们就得深入内部 ...
0. 一字一句的搞懂vue-cli之vue webpack template配置
此篇文章地址: https://www.cnblogs.com/xyyt/p/9117361.html webpack--神一样的存在.无论写了多少次,再次相见,仍是初见.有的时候开发vue项目,对 ...
vue 变量定义对象_详解Vue 全局变量，局部变量
局组件和局部组件 1.先定义组件 Vue.component('组件名', { 组件模板对象 }) 注意: 组件名不要使用原生的标签名, 若组件名定义时用的是驼峰命名法, 则调用时用中划线分割后小 ...
vue动画效果配置和弹层css sticky footer
vue动画效果配置有两种方式: 一种是css方式需要注意 4 个(CSS)类名在 enter/leave 的过渡中切换: v-enter: 定义进入过渡的开始状态.在元素被插入时生效,在下一个帧移 ...
redirect路由配置 vue_Web前端：Vue路由进阶配置
大家好,我来了,本期为大家带来的前端开发知识是"Web前端:Vue路由进阶配置",有兴趣做前端的朋友,和我一起来看看吧! 1. 页面打开权限流程页面是否能打开有以下两点判断: 1 ...
vue-cli3中的vue.config.js配置
vue-cli3中的vue.config.js配置我的跨域是配置通过chrome浏览器的跨域设置,前端修改跨域问题,以此解决跨域的,故没有配置代理: const path = require('pa ...
vue-router路由、mixin混入、vue-resource、axios、计算属性watch、moment.js、vuex、vue-cli、数据双向绑定、搭建vue环境、vue实例、配置启动项
路由vue-router介绍: // 1.前端路由核心:锚点值的改变,根据不同的锚点值,渲染指定dom位置的不同数据.// 2.vue中,模板数据不是通过ajax请求的,而是调用函数获取到模板内容// ...
vue全局变量的定义与任意调用
vue全局变量的定义与任意调用首先: 在main.js文件中定义全局变量的代码,举例示下: 参考文章:https://www.cnblogs.com/weibanggang/p/11368615. ...
vue.js路由配置vue-router的基础学习 - 概念篇
文章目录引言 · 相关问题小结: 一.动态路由匹配 (两种情况) A. 两种情况,代码对比: B. 两种情况,效果图对比: C. 提醒 · 仔细体会: D. 优先级的问题: 二.嵌套路由引言 · ...

vue全局变量的配置

一、vue 全局变量(vue 全局变量又是需要单独设置请求路径的前缀，但又要根据当前环境是开发环境还是生产环境动态匹配，那么就用这种方法）

二、自定义全局变量

vue全局变量的配置相关推荐

最新文章

热门文章