备案控制台
开发者社区 开发与运维 文章 正文

Vue 入门系列：.env 环境变量

2024-05-17 26
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介： Vue 入门系列：.env 环境变量

1. env 文件

.env： 所有环境被载入

.env.development：开发环境被载入

.env.production： 生产环境被载入

.env.local： 所有环境都被载入，但会被 git 忽略

2. 在 vue2 中使用

// 属性名必须以VUE_APP_开头，比如VUE_APP_XXX
// .env.development
VUE_APP_BASE_API = "/dev-api";
 
// 调用
process.env.VUE_APP_BASE_API

3. 在 vue3 中使用

// 属性名必须以VITE_开头，比如VITE_XXX
// .env.development
VITE_APP_BASE_API = '/dev-api'
 
// 调用
import.meta.env.VITE_APP_BASE_API


文章标签：
JavaScript
开发工具
git
关键词：
vue VUE.js
入门VUE.js
vue入门VUE.js
env VUE.js
vue env VUE.js
yqcoder
目录
相关文章
_BugMan
|
1天前
|
JavaScript API
【vue实战项目】通用管理系统：信息列表，信息的编辑和删除
【vue实战项目】通用管理系统：信息列表，信息的编辑和删除
_BugMan
11 2
_BugMan
|
1天前
|
JavaScript API
【vue实战项目】通用管理系统：信息列表，信息录入
【vue实战项目】通用管理系统：信息列表，信息录入
_BugMan
8 3
_BugMan
|
1天前
|
JavaScript 前端开发 API
【vue实战项目】通用管理系统：学生列表
【vue实战项目】通用管理系统：学生列表
_BugMan
12 2
_BugMan
|
1天前
|
缓存 JavaScript
【vue实战项目】通用管理系统：首页
【vue实战项目】通用管理系统：首页
_BugMan
9 2
_BugMan
|
1天前
|
JavaScript 前端开发 数据安全/隐私保护
【vue实战项目】通用管理系统：登录页
【vue实战项目】通用管理系统：登录页
_BugMan
9 2
肥晨
|
8天前
|
JavaScript 前端开发 开发者
vue3+ts配置跨域报错问题解决：＞ newpro2@0.1.0 serve ＞ vue-cli-service serve ERROR Invalid options in vue.
【6月更文挑战第3天】在 Vue CLI 项目中遇到 "ERROR Invalid options in vue.config.js: ‘server’ is not allowed" 错误是因为尝试在 `vue.config.js` 中使用不被支持的 `server` 选项。正确配置开发服务器（如代理）应使用 `devServer` 对象，例如设置代理到 `http://xxx.com/`： ```javascript module.exports = { devServer: {
肥晨
22 1
NorthS
|
1天前
|
JavaScript 网络架构
Vue中三个点（...）的意思
**孤立元素**：通过扩展运算符（`...`）可以将数组元素打印出来，如 `console.log(...iArray)`。 - **添加元素**：可以使用扩展运算符结合数组合并来添加元素，例如 `['0', ...iArray, '4']` 或者使用 `push` 方法。 - **删除元素**：通过解构赋值取出数组第一个元素，如 `const [first, ...last] = arr`。 - **数组合并**：可以使用扩展运算符将多个数组合并，如 `[...arr1, ...arr2]`。
NorthS
5 0
NorthS
|
1天前
|
JavaScript 前端开发
vue filters过滤器传多个参数
这段内容展示了如何在HTML和JavaScript中使用过滤器（filter）。在HTML中，通过`{{变量 | 过滤器名(参数)}}`的方式传递参数给过滤器。在JavaScript中，定义过滤器函数并接收参数，如`filterAa(aa, bb, cc)`，其中`aa`, `bb`, `cc`分别代表过滤器接收到的第1至第3个参数。示例逐步演示了传1个、2个到3个参数给过滤器的过程。
NorthS
9 1
八百标兵奔北坡
|
3天前
|
JavaScript
vue数据的双向绑定
vue数据的双向绑定
八百标兵奔北坡
10 1
kaixin321-44007
|
3天前
|
JavaScript
vue的插槽（slot）
vue的插槽（slot）
kaixin321-44007
7 1

热门文章

最新文章

  • 1
    Vue+Django+MySQL搭建指南（个人全栈快速开发）
  • 2
    使用 Vue 2.0 实现服务端渲染的 HackerNews
  • 3
    Flask：使用SocketIO实现WebSocket与前端Vue进行实时推送（gevent-websocket、flask-socketio、flask不出现running on 127..问题）
  • 4
    基于 Vue 的 16 个 UI 框架集锦
  • 5
    vue 路由demo
  • 6
    Vue.js 事件处理器 v-on
  • 7
    部署Vue项目到Nginx：简明教程
  • 8
    【踩坑记录】Vuex中更改state的数据但是Vue中没有做出改变
  • 9
    vue router 4 源码篇：路由诞生——createRouter原理探索
  • 10
    基于Vue+Vue-Router+Vuex+SPA+element ui admin实现在线教育前端（二）
  • 1
    在vue中，怎样理解 Vue 的单向数据流？
    33
  • 2
    在vue中，Class 与 Style 如何动态绑定？
    18
  • 3
    在vue中，v-show 与 v-if 有什么区别？
    27
  • 4
    在vue中，如何实现SPA单页面应用的路由管理？
    30
  • 5
    在vue中，说说你对 SPA 单页面的理解，它的优缺点分别是什么？
    49
  • 6
    解决Vue 3 + Element Plus树形表格全选多选以及子节点勾选的问题
    107
  • 7
    Vue中el与data的两种写法
    21
  • 8
    Vue之数据绑定
    16
  • 9
    使用Vue.js、Vuetify和Netlify构建现代化的响应式网站
    52
  • 10
    初识Vue 输出Hello World 及注意事项
    28

    • 相关课程

    更多
  • Spring Boot+Vue.js+FastDFS实现分布式图片服务器
  • Vue.js 入门与实战
  • Vue.js完全自学手册图文教程

    • 相关电子书

    更多
  • 基于VUE的单页面性能优化实践
  • Vue.js 在前端服务化上的探索与实践
  • Vue.js在前端服务化上的实践与探索

    • 相关实验场景

    更多
  • 前端开发基础6：Node.js和LESS预编译工具
  • 搭建Node.js编程环境
    • 下一篇
    2024年阿里云免费云服务器及学生云服务器申请教程参考