Vite环境变量不生效

最新推荐文章于 2024-05-13 09:40:28 发布
最新推荐文章于 2024-05-13 09:40:28 发布
阅读量2.9k 收藏 1
点赞数 4
文章标签： 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/drunk2/article/details/130835713
版权

Vite使用环境变量，在项目中的import.meta.env.VITE_XXX显示undefined

搞到这一步的应该都清楚环境变量的配置了，就不多阐述了。默认只识别VITE开头的变量应该也不用多说。
VITE创建项目后就有了.env.development文件了，开发环境运行时默认使用该文件，但是在项目中就是读不出值undefined，只能读出默认项。

解决办法：删了该文件重创(有具体知道为什么要重创的请提点一下我，谢谢。我有空也会再研究研究，这个坑踩了我很久了)

绝美焦栖
关注
  • 4
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
放在vite项目的index.html里不对，放在直接的html里也不对，试试放在
weixin_40945354的博客
07-01 1990
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <link rel="icon" href="/favicon.ico" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Vite App&lt
vite搭建three.js的开发环境
01-06
使用vite搭建three.js的开发环境，详细见文章：http://t.csdnimg.cn/08Ln9
【react+ts】找不到less类型,Cannot find module ‘./xxx.module.less‘ or its corresponding type declarations
我的开源项目:https://gitee.com/derekgo/vue-cms_xg
01-26 5201
问题描述 Cannot find module ‘./index.module.less’ or its corresponding type declarations 找不到less后缀名的类型 解决办法 在src目录下创建类型声明文件react-app-env.d.ts，并且声明less类型 内容如下 declare module '*.module.less' { const classes: { readonly [key: string]: string }; export de
vite 环境变量-多模式配置
最新发布
06-13
vite 环境变量-多模式配置
vite环境变量配置
weixin_39755186的博客
05-13 243
dotenv会自动读取.env文件，并解析这个文件中的对应环境变量，并将其注入到process中，vite 会将对应的环境变量注入到import.meta.env里去，如.env 里配置 VITE_APP_KEY 就可读取出来。客户端通过import.meta.env 获取配置内容。.env.development 配置。vite.config.js 配置。
vite .env.test环境使用ant design vue ，打包后a-date-picker控件无法选择日期
拿回忆下酒
04-11 1267
vite .env.test环境使用ant design vue ，打包后a-date-picker控件无法选择日期
vue3 在vite.config中无法使用import.meta.env.*的解决办法
大赚万万亿
12-20 1689
第一种,优先使用第一种方法,其中参数mode就是自定义--mode的值,如果没写,就是production或development。
在.env.development文件中设置全局变量没有生效
changyana的博客
11-15 1819
在平台上线时需要区分开发环境和生产环境，所以在.env.development和.env.production中进行配置。然而我设置了变量，发现并没有生效。
记录：vue3 vite 打包生产环境失败
TrainTu的博客
04-25 226
vue3 打包报错
vite4生产环境打包报错NODE_ENV=production is not supported in the .env file.
可可爱爱的你吖的博客
12-30 8400
NODE_ENV=production is not supported in the .env file. Only NODE_ENV=development is supported to create a development build of your project.
vue项目环境配置文件.env不起作用
weixin_52395730的博客
07-13 2957
vue项目环境配置文件.env不起作用 .env文件在vue项目启动时加载，如果没有起到作用，可能是缓存的问题，删除node_modules下的.cache文件试试。
Laravel Vite 执行 npm run build 后任然无法加载编译后的文件。
qq_38316379的博客
04-13 338
Laravel Vite 执行 npm run build 后任然无法加载编译后的文件，一直加载热更新文件，网站资源加载失败，删除hot文件即可。
解决在vue项目中webpack打包后字体不生效的问题
10-18
今天小编就为大家分享一篇解决在vue项目中webpack打包后字体不生效的问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
Cesium+Vue3+vite环境搭建好的的源码
02-27
Cesium+Vue3+vite环境搭建好的的源码，方便小白快速开始学习
Vite分享、原理介绍ppt
11-15
本ppt从什么是vite、为什么选择vite作为构建工具、vite与webpack在冷启动与热更新方面的区别、vite的优势与劣势等方面详细介绍了vite的相关知识。同时本ppt含盖较为详细的vite的原理介绍，如vite是如何处理依赖预购...
vue3 + vite 环境变量踩坑
Nikon_的博客
07-18 1368
众所周知，项目搭建过程中，存在环境的区分。一般项目中都会存在env的俩个配置环境变量的配置文件。例如以下生产环境、开发环境的环境变量文件：//.env.development 生产环境变量文件# 开发环境配置​# 开发环境​# 生产环境配置​# 生产环境​然后在package.json中配置对应环境启动命令用以启动不同环境},根据代码运行环境变化而变化的变量就是所谓的环境变量。在生产环境和开发环境中最多用以区分接口公共路径来请求不同接口。环境变量一般在全局可以访问得到。
设置.env.development无效
H_W_K的博客
04-08 3579
第一次接手后台新项目，看过公司其他后台项目代码，也改过BUG，知道请求封装的URL通常会在.env.development里面设置各种VUE_APP_BASE_API，但是我修改以后并没有反应，查了很多，都是告诉怎么设置的，但是我设置了却没有效果。后来发现犯了新手错误。 1.其实方法超简单，只是新手一般不会有相应意识（我也是新人），还有不知道什么时候要做这个操作，那就是代码重跑（npm run dev），代码一些配置的更改是需要让代码重新运行一次的 2.在后端还没有弄好登录的相关部分，前端已经开始写页面
vite项目无法访问process.env
qq2351227851的博客
10-18 550
文件中的环境变量，在vite官网中有提到。使用vite打包的项目无法使用。
vue3 + vite 代理配置无效的原因
GFreasy的博客
01-09 4299
vue3 + vite 代理配置无效的原因。
vite proxy代理不生效
09-04
从引用的描述可以看出，vite proxy代理不生效的问题可能是由于访问方式不正确导致的。在该引用中，当使用localhost访问时代理不成功，但使用127.0.0.1访问时代理起作用了。所以，你可以尝试使用正确的访问方式来解决这个问题。 此外，引用中提到，在配置完代理后一定要重新执行命令，即重新运行npm run dev命令。如果代理仍未生效，可以检查项目中的index.js文件中的代理配置是否正确。确保代理配置正确后重新执行命令。 另外，引用中的vite.config配置示例也可以作为参考。你可以检查vite.config文件中的代理配置是否正确，并确保代理路径、目标地址、跨域设置等都正确设置。 总结而言，vite proxy代理不生效的原因可能是访问方式不正确或代理配置有误。你可以尝试使用正确的访问方式，并检查代理配置是否正确设置。如果问题仍然存在，可以进一步排查其他可能的原因。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* [记录一次vite代理不成功的奇葩问题](https://blog.csdn.net/ai520587/article/details/130934082)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 33.333333333333336%"] - *2* [Vue使用Proxy代理后仍无法生效的解决](https://download.csdn.net/download/weixin_38526823/14900988)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 33.333333333333336%"] - *3* [vue3 vite配置跨域以及不生效问题](https://blog.csdn.net/Motion_zq/article/details/128904854)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 33.333333333333336%"] [ .reference_list ]

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值