Vue:配置.env.dev文件不生效的问题

最新推荐文章于 2024-09-29 15:21:30 发布

是席木木啊

最新推荐文章于 2024-09-29 15:21:30 发布

阅读量5.9k

点赞数

分类专栏： WebGIS 文章标签： vue.js 前端 env配置文件 process.env

本文链接：https://blog.csdn.net/weixin_43524214/article/details/125350283

版权

WebGIS 专栏收录该内容

104 篇文章 72 订阅 ¥199.90 ¥299.90

订阅专栏

超级会员免费看

在Vue项目中，作者遇到.env.dev配置文件设置的环境变量未在开发环境中生效的问题。通过检查发现，未在npm run serve命令中指定加载.env.dev文件。修正package.json中的scripts配置后，重新启动项目，环境变量成功加载，问题得到解决。

摘要由CSDN通过智能技术生成

问题描述

Vue项目的.env.dev文件配置如下，但是在启动项目之后，通过process.env.VUE_APP_SCISERVE获取到的变量值一直为undefined❓❓❓💢💢💢。
在这里插入图片描述

# 开发环境配置-在配置文件中定义自定义变量时，一定要以 ‘VUE_APP_'开头，否则Vue无法读取此变量
NODE_ENV="dev"
VUE_APP_ENV_DESC="开发环境"
# 后端接口配置
VUE_APP_SCISERVE<

了解本专栏

订阅专栏解锁全文

超级会员免费看

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

是席木木啊

关注关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
打赏
2
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录

订阅专栏

process.env.VUE_APP_BASE_API 获取不到

m0_67402026的博客

03-08

1万+

process.env.VUE_APP_BASE_API 获取不到 import axios from 'axios' // 创建axios实例 const service = axios.create({ baseURL: process.env.VUE_APP_BASE_API, // api的base_url timeout: 50000, // 请求超时时间, }) axios.defaults.headers = { contentType: 'application/json',

vue项目之.env文件.env.dev、test、pro

weixin_52941842的博客

01-12

2317

env文件是vue运行项目时的环境配置文件。env: 全局默认配置文件，所有环境(开发、测试、生产等）均会加载并合并该文件。

2 条评论您还未登录，请先登录后发表或查看评论

【vite】vite环境变量.env文件的配置及使用，环境变量读取问题

热门推荐

yehaocheng520的博客

07-01

4万+

在用vue框架时，经常用到两种环境，一种是开发环境，就是本地开发时的环境，一种是生产环境，就是要发布到线上的环境。平时开发是用生产环境的，如果发布到线上时，需要切换环境为线上。如果人为去切换也是可以的，但是会容易忘记，可以通过配置不同的运行命令来自动切换环境。下面开始：配置环境的实现原理实现原理就是采用node.js顶层对象中的process.env（进程环境，返回一个包含用户环境信息的对象）属性，根据各个环境的配置文件区分和切换环境具体实例 1. 安装依赖 npm install process

vue中利用.env文件存储全局环境变量，以及配置vue启动和打包命令

鹏多多的博客

04-29

4128

目录1，前言2，.env文件的作用3，配置.env文件4，配置启动命令5，获取.env中的全局变量5，实际用处 1，前言分享一下vue项目中利用.env文件存储全局环境变量，以及利于项目开发的vue启动以及打包命令。 2，.env文件的作用在vue项目中，env是全局配置文件，可以存储不同环境下的变量。使用vue-cli搭建项目，默认会在根目录创建一个.env文件，如果需要更多类型的.env文件，需要自行创建。其中： 1，.env 后缀的文件是全局默认配置文件，不论什么环境都会加载并合并。 2，

.env.dev不生效问题

qq_42931285的博客

04-22

2977

你可以通过传递 --mode 选项参数为命令行覆写默认的模式,默认则是 “development”。默认情况下 – mode ××是不用写的。如下图；这时默认回去.env.developmen中读取。不是。env.dev 若想从.env.dev中读取, 则应该自定义，在mode后面写上dev就行。 ```"dev": "vue-cli-service build --mode dev" ...

vue项目环境配置文件.env不起作用

weixin_52395730的博客

07-13

3137

vue项目环境配置文件.env不起作用 .env文件在vue项目启动时加载，如果没有起到作用，可能是缓存的问题，删除node_modules下的.cache文件试试。

.env.dev/.env.development更改后不生效？（vue）

weixin_43677787的博客

03-13

2178

.env.dev/.env.development更改后不生效？（vue）

vue配置.env.development地址不生效

菜菜鸟的博客

12-06

7627

格式 # 开发环境配置 ENV = 'development' # 管理系统/开发环境 VUE_APP_BASE_API = '/dev-api' # 图片基础路径 VUE_APP_BASE_IMG = '/dev-api' 注意:路径变量必须得用VUE_APP开头

vue 配置env环境变量失效问题

当然是最帅气的茶茶丸了！哇耶~

09-20

3530

2.注意.env.development .env.production要放在项目根目录下（我就是不小心放到了SRC下没发现.......）注意一一对应 serve默认为development开发模式。3.要在package.json中配置service服务。1.注意变量名要以VUE_APP_开头。

Vue2/3配置环境变量不生效

qq_59626859的博客

01-12

987

【代码】Vue2/3配置环境变量不生效。

vue配置代理vue.config.js后不生效（小坑）

m0_67392182的博客

03-09

4885

我的项目使用vue-cli4脚手架搭建的，想要修改webpack配置，需要手动在根目录下面添加一个vue.config.js文件，会自动识别该文件。附上我的配置： // vue.config.js 配置说明 //官方vue.config.js 参考文档 https://cli.vuejs.org/zh/config/#css-loaderoptions // 这里只列一部分，具体配置参考文档 module.exports = { // 部署生产环境和开发环境下的URL。 // 默认情况下，V

Vue3.0+vite vite.config.ts配置与env

qq_42396791的博客

03-15

1594

【代码】Vue3.0 vite.config.ts配置。

VUE 中利用.env文件定义全局变量

Ctrl-a-c-v44220970的博客

03-03

1439

在平时的vue开发中，我们可以在多个页面用到同一个字段，或者是网页的根路径，直接写在代码里面不便于维护，后续修改的时候，也需要修改到很多的页面，于是我们就想有没有一种办法可以定义一个全局的变量，在各个vue文件里面可以直接用，本篇文章讲的介绍如何利用.env文件来定义全局的变量。

vue中 process.env.XXX环境变量不生效（获取不到数据）

zlfjavahome的专栏

06-20

7740

vue中 process.env.XXX环境变量不生效（获取不到数据）

关于Vue的process.env.设置全局变量不生效问题

香酥蟹的博客

12-20

2万+

前言在.env.development文件中设置全局变量的时候发现并没有生效，问题查了好久，终于在https://segmentfault.com/q/1010000016412563?sort=created 找到问题所在，只有申明前缀为VUE_APP_的配置才能生效。问题所在在这个文件下面@vue/cli-service/lib/util/resolveClientEnv.js 有如下内...

【已解决】vue/react .env.development 中读取不到变量：undefined

程序边界

06-01

3747

中读取不到变量，undefined。react 项目中，通过。

vue3 .env 环境变量的配置及应用

这是个问题

11-18

3848

vue3 .env环境文件的配置与使用

vue3中.env.dev文件结合axios.defaults.baseURL的使用

u011200562的博客

10-25

2927

结构是这样的：在项目里面新建.env.dev文件内容如下： NODE_ENV=development VUE_APP_SERVER=http://127.0.0.1:8880 VUE_APP_WS_SERVER=ws://127.0.0.1:8880 修改package.json 注意: 执行npm run serve-dev时 , --mode指定环境模式 dev(默认值：development),即执行.env.dev文件. 最后在main.js中修改axios的ba...

vue .env.development 配置

04-22

它是什么？如何使用它？ .env.development 文件是用于开发环境的配置文件。它可以存储开发环境所需要的各种配置项，比如 API 地址、端口号、URL 等等。这些配置项在开发过程中可以通过 process.env.XXX 的方式获取到，其中 XXX 是配置项的名称。在使用 .env.development 文件时，需要在 Vue 项目的根目录下创建一个名为 .env.development 的文件，并在其中定义配置项。在项目中，可以通过 process.env.XXX 的方式获取到定义在 .env.development 文件中的配置项。在 devServer 的配置中，也可以通过 process.env 来获取到配置项。需要注意的是，.env.development 文件中的配置项只在开发环境中生效，打包时并不会被打包进最终的代码中。如果需要在生产环境中使用这些配置项，可以创建一个 .env.production 文件用于生产环境的配置。