vue3+vite 实现.env全局配置

news2025/5/15 13:34:43

首先创建.env文件

VUE_APP_BASE_API='http://127.0.0.1/dev-api'

然后引入依赖:

pnpm install dotenv --save-dev

引入完成后,在vite.config.js配置文件内加入以下内容:

const env = dotenv.config({ path: './.env' }).parsed

define: {

    // 将环境变量注入到全局变量中

    'process.env': env

  },

const env = dotenv.config({ path: './.env' }).parsed

export default defineConfig({
  plugins: [
    vue()
  ],
  define: {
    // 将环境变量注入到全局变量中
    'process.env': env
  }
})

这样就配置完成了,然后在js内process.env.VUE_APP_BASE_API就可以直接获取到数据了。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2338111.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

AI 组件库是什么?如何影响UI的开发?

AI组件库是基于人工智能技术构建的、面向用户界面(UI)开发的预制模块集合。它们结合了传统UI组件(如按钮、表单、图表)与AI能力(如机器学习、自然语言处理、计算机视觉),旨在简化开发流程并增强…

OpenCV day6

函数内容接上文:OpenCV day4-CSDN博客 , OpenCV day5-CSDN博客 目录 平滑(模糊) 25.cv2.blur(): 26.cv2.boxFilter(): 27.cv2.GaussianBlur(): 28.cv2.medianBlur(): 29.cv2.bilateralFilter(): 锐…

【AI飞】AutoIT入门七(实战):python操控autoit解决csf视频批量转换(有点难,AI都不会)

背景: 终极目标:通过python调用大模型,获得结果,然后根据返回信息,控制AutoIT操作电脑软件,执行具体工作。让AI更具有执行力。 已完成部分: 关于python调用大模型的,可以参考之前的…

MARA/MARC表 PSTAT字段

最近要开发一个维护物料视图的功能。其中PSTAT字段是来记录已经维护的视图的。这里记录一下视图和其对应的字母。 MARA还有个VPSTA(完整状态)字段,不过在我试的时候每次PSTAT出现一个它就增加一个,不知道具体是为什么。 最近一直…

学习型组织与系统思考

真正的学习型组织不是只关注个人的学习,而是关注整个系统的学习。—彼得圣吉 在这两年里,越来越多的企业开始询问是否可以将系统思考的内容内化给自己的内训师,进而在公司内部进行教学。我非常理解企业这样做的动机,毕竟内部讲师…

支持mingw g++14.2 的c++23 功能print的vscode tasks.json生成调试

在mingw14.2版本中, print库的功能默认没有开启, 生成可执行文件的tasks.json里要显式加-lstdcexp, 注意放置顺序. tasks.json (支持mingw g14.2 c23的print ) {"version": "2.0.0","tasks": [{"type": "cppbuild","…

守护者进程小练习

守护者进程含义 定义:守护进程(Daemon)是运行在后台的特殊进程,独立于控制终端,周期性执行任务或等待事件触发。它通常以 root 权限运行,名称常以 d 结尾(如 sshd, crond)。 特性&a…

opencv函数展示3

一、图像平滑(模糊) 线性滤波(速度快): 1.cv2.blur() 2.cv2.boxFilter() 3.cv2.GaussianBlur() 非线性滤波(速度慢但效果好): 4.cv2.medianBlur() 5.cv2.bilateralFilter() 二、锐…

遥感技术赋能电力设施监控:应用案例篇

目前主流的电力巡检手段利用无人机能够通过设定灵活航线进行低空飞行、搭载不同的采集设备,能够从不同角度对输电线进行贴近拍摄,但缺陷是偏远山区无人机飞行技术要求高,成本高,且飞行的无人机也可能会对输电线产生破坏。 星图云开…

SpringAI+DeepSeek大模型应用开发——5 ChatPDF

ChatPDF 知识库 RAG检索增强 由于训练大模型非常耗时,再加上训练语料本身比较滞后,所以大模型存在知识限制问题: 知识数据比较落后,往往是几个月之前的;不包含太过专业领域或者企业私有的数据; 为了解决…

yolov8 框架自带模型体验功能

简介 YOLOv8 是 ultralytics 公司在 2023 年 1月 10 号开源的 YOLOv5 的下一个重大更新版本,目前支持图像分类、物体检测和实例分割任务。 YOLOv8 是一个 SOTA 模型,它建立在以前 YOLO 版本的成功基础上,并引入了新的功能和改进&#xff0c…

Android --- SystemUI启动流程

1.main 函数入口,调用SystemServer().run()方法 代码路径:frameworks/base/services/java/com/android/server/SystemServer.java 2.run 方法中有3种服务的启动,我们主要看StartOtherService 代码路径:frameworks/base/services/java/com/android/se…

【SpringMVC】深入解析自定义拦截器、注册配置拦截器、拦截路径方法及常见拦截路径、排除拦截路径、拦截器的执行流程

拦截器 上个章节我们完成了强制登录的功能, 后端程序根据Session来判断用户是否登录, 但是实现方法是比较麻烦的: 需要修改每个接口的处理逻辑需要修改每个接口的返回结果接口定义修改, 前端代码也需要跟着修改 有没有更简单的办法, 统一拦截所有的请求, 并进行Se…

基于VS Code 为核心平台的python语言智能体开发平台搭建

以下是基于 VS Code 为核心平台,整合 Node-RED、Gradio、Docker Desktop 的智能体可视化开发平台优化方案,聚焦工具链深度集成与开发效率提升: 一、核心架构设计 #mermaid-svg-f8l9kYPAlJ2TlpGF {font-family:"trebuchet ms",verd…

使用最新threejs复刻经典贪吃蛇游戏的3D版,附完整源码

基类Entity 建立基类Entity,实现投影能力、动画入场效果(从小变大的弹性动画)、计算自己在地图格位置的方法。 // 导入gsap动画库(用于创建补间动画) import gsap from gsap// 定义Entity基类 export default class …

论坛测试报告

作者前言 🎂 ✨✨✨✨✨✨🍧🍧🍧🍧🍧🍧🍧🎂 ​🎂 作者介绍: 🎂🎂 🎂 🎉🎉&#x1f389…

zset.

zset 有序集合 zset 保留了 set 不能有重复元素的特点 zset 中的每个元素都有一个唯一的浮点类型的分数(score)与之关联,使得 zset 内部的元素是可以维护有序性的。但是这个有序不是用下标作为排序依据的,而是根据分数&#xf…

Windows 部署 DeepSeek 详细教程

一、准备工作 系统要求: 建议Windows 10 22H2 或更高版本,家庭版或专业版上网环境: 建议科学上网,国内访问部分网站会很慢设备要求: 内存8G以上、关闭防火墙 二、安装Ollama 官网链接: https://ollama.com/downloadg…

过去十年前端框架演变与技术驱动因素剖析

一、技术演进脉络(2013-2023) 2013-2015:结构化需求催生框架雏形 早期的jQuery虽然解决了跨浏览器兼容性问题(如IE8兼容性处理),但其松散的代码组织方式难以支撑复杂应用开发。Backbone.js的出现首次引入M…

基于微信小程序的中医小妙招系统的设计与实现

hello hello~ ,这里是 code袁~💖💖 ,欢迎大家点赞🥳🥳关注💥💥收藏🌹🌹🌹 🦁作者简介:一名喜欢分享和记录学习的在校大学生…