当前位置: 首页 > news >正文

vue2 使用环境变量

一. 在根目录下创建.env.xxx文件

.env 基础系统变量,无论何种环境,都可使用其中配置的值,其他环境中的变量会覆盖.env中的同名变量。
.env.development 开发环境
.env.production 生产环境
.env.staging 测试环境

 

二. 内容格式

        vue2 使用是以 VUE_开头, vue3 使用是以 VITE_开头

# 开发环境配置# 页面标题
VUE_APP_TITLE = '项目名称'# 开发环境配置
ENV = 'development'# API
VUE_APP_BASE_API = "http://xxx.xxx.xxx/"# 路由懒加载
VUE_CLI_BABEL_TRANSPILE_MODULES = true

三.使用多环境配置,package.json文件:用于build 打包配置 或者使用serve配置 启动不同的服务地址

        

"scripts": {"dev": "npm run serve","serve": "vue-cli-service serve","serve:dev": "vue-cli-service serve --mode development","serve:pro": "vue-cli-service serve --mode production","build": "vue-cli-service build"
},

 vue3的配置写法

"scripts": {"dev": "vite --mode development","stage": "vite --mode staging","prod": "vite --mode production","preview": "vite preview","build": "vite build","build:dev": "vite build --mode development","build:prod": "vite build --mode production","build:stage": "vite build --mode staging"
},

四. 在请求服务地址配置文件中修改(request.js)

const service = axios.create({baseURL: process.env.VUE_APP_BASE_API, // api 的 base_urltimeout: 1000 * 60 * 30})

 

借鉴:关于vue环境变量的使用(全面)_vue环境变量文件-CSDN博客

相关文章:

vue2 使用环境变量

一. 在根目录下创建.env.xxx文件 .env 基础系统变量,无论何种环境,都可使用其中配置的值,其他环境中的变量会覆盖.env中的同名变量。 .env.development 开发环境 .env.production 生产环境 .env.staging 测试环境 二. 内容格式 vue2 使用是以…...

数据预处理

继续提取代码片段: 12. **导入iris数据集并查看前5行数据**: python from sklearn.datasets import load_iris iris load_iris() X iris.data print(iris数据集的维度为:, X.shape) print(iris数据集的前5行数据为:\n, X[:5]) …...

django宠物领养管理系统-计算机毕业设计源码26858

目录 1 绪论 1.1 选题背景与意义 1.2国内外研究现状 1.3论文结构与章节安排 2系统分析 2.1 可行性分析 2.2 系统流程分析 2.2.1 数据流程 3.3.2 业务流程 2.3 系统功能分析 2.3.1 功能性分析 2.3.2 非功能性分析 2.4 系统用例分析 2.5本章小结 3 系统总体设计 3…...

使用TeamViewer远程局域网内的两台电脑

有个场景,有人还不知道TV可以局域网操作,记录一下。 主要就是修改设置,将取消激活改为接受 然后输入受控端的ip即可...

GUI简介、Swing的常用组件、java程序的运行过程、class文件、JAR、runable_jar、双括号初始化

GUI简介 GUI:图形用户界面,在计算机中采用图形的方式显示用户界面 java的GUI开发 AWT:java最早推出的GUI编程开发包,界面风格跟随操作系统SWT:eclipse就是java使用SWT开发的Swing:在AWT的基础上扩充了功能…...

@Autowired和@Resource和getBean()区别

今天遇到一个对我来说很奇葩的错误,我想在Service中注入bean,我这里使用了Autowired和Resource都不能注入,导致初始化失败,使用了getBean()方法就可以注入。从来没有遇到过这个问题。后来我查询了一下,才明白了原理。我…...

Merlion笔记(四):添加一个新的预测模型

文章目录 1 模型配置类2 模型类3 运行模型:一个简单的例子4 可视化5 定量评估6 定义一个基于预测器的异常检测器 本文提供了一个示例,展示如何向 Merlion 添加一个新的预测模型,遵循 CONTRIBUTING.md 中的说明。建议在阅读本篇文章之前,先查…...

【论文阅读】ESRGAN

学习资料 论文题目:增强型超分辨率生成对抗网络(ESRGAN: Enhanced Super-Resolution Generative Adversarial Networks)论文地址:[1809.00219] ESRGAN:增强型超分辨率生成对抗网络代码:xinntao / ESRGAN&am…...

电脑异常情况总结

文章目录 笔记本无症状息屏黑屏 笔记本无症状息屏黑屏 🍎 问题描述: 息屏导致黑屏;依次操作计算机--》右键--》管理--》事件查看器--》Windows日志--》系统;从息屏到异常黑屏之间出现了很多错误,如下:事件…...

[项目详解][boost搜索引擎#1] 概述 | 去标签 | 数据清洗 | scp

目录 一、前言 二、项目的相关背景 三、搜索引擎的宏观原理 四、搜索引擎技术栈和项目环境 五、正排索引 VS 倒排索引--原理 正排索引 分词 倒排索引 六、编写数据去除标签和数据清洗模块 Parser 1.数据准备 parser 编码 1.枚举文件 EnumFile 2.去标签ParseHtml(…...

PL/I语言的起源?有C语言,有B语言和A语言吗?为什么shell脚本最开始可能有#!/bin/bash字样?为什么不支持嵌套注释?

PL/I语言的起源 在20世纪50~60年代,当时主流的编程语言是COBOL/FORTRAN/ALGOL等,IBM想要设计一门通用的编程语言,已有的编程语言无法实现此要求,故想要设计一门新语言,即是PL/I. PL/I是Programming Language/One的缩写…...

gin入门教程(3):创建第一个 HTTP 服务器

首先设置golang github代理,可解决拉取git包的时候,无法拉取的问题: export GOPROXYhttps://goproxy.io再查看自己的go版本: go version我这里的版本是:go1.23.2 linux/arm64 准备工作做好之后就可以进行开发了 3.…...

Vue+ECharts+iView实现大数据可视化大屏模板

Vue数据可视化 三个大屏模板 样式还是比较全的 包括世界地图、中国地图、canvas转盘等 项目演示: 视频: vue大数据可视化大屏模板...

el-table 表格设置必填项

el-table 表格设置必填项 要在 el-table 中集成 el-form 来设置必填项,并进行表单验证,可以使用 Element UI 提供的表单验证功能。下面是一个详细的示例,展示了如何在 el-table 中使用 el-form 来设置必填项,并进行验证。 示例代…...

vivo 轩辕文件系统:AI 计算平台存储性能优化实践

在早期阶段,vivo AI 计算平台使用 GlusterFS 作为底层存储基座。随着数据规模的扩大和多种业务场景的接入,开始出现性能、维护等问题。为此,vivo 转而采用了自研的轩辕文件系统,该系统是基于 JuiceFS 开源版本开发的一款分布式文件…...

Vue学习笔记(四)

事件处理 我们可以使用 v-on 指令 (通常缩写为 符号) 来监听 DOM 事件,并在触发事件时执行一些 JavaScript。用法为 v-on:click"methodName" 或使用快捷方式 click"methodName" 事件处理器的值可以是: 内联事件处理器&#xff1…...

发送短信,验证码

短信 注册阿里云的账号 开通短信服务 测试短信服务是否可用 导入jar <!-- 短信相关 --><dependency><groupId>com.aliyun</groupId><artifactId>aliyun-java-sdk-core</artifactId><version>4.6.0</version><…...

国内大语言模型哪家更好用?

大家好&#xff0c;我是袁庭新。 过去一年&#xff0c;AI大语言模型在爆发式增长&#xff0c;呈现百家争鸣之态。国内外相关厂商积极布局&#xff0c;并相继推出自家研发的智能化产品。 我在工作中已习惯借助AI来辅助完成些编码、创作、文生图等任务&#xff0c;甚至对它们产…...

OTP一次性密码、多因子认证笔记

文章目录 双因子认证(多因子认证)otp算法(ONE-TIME PASSWORD)otp算法大概分为几部 otp的机制服务端客户端(app端)两种主流算法otp流程图 otp是通用的吗 手机验证码天天在用&#xff0c;但是居然不知道这个是otp&#xff0c;伤自尊了&#xff0c;必须弄清原理。 先要知道几个概念…...

玉米生长阶段检测系统源码&数据集全套:改进yolo11-dysample

改进yolo11-DLKA等200全套创新点大全&#xff1a;玉米生长阶段检测系统源码&#xff06;数据集全套 1.图片效果展示 项目来源 人工智能促进会 2024.10.24 注意&#xff1a;由于项目一直在更新迭代&#xff0c;上面“1.图片效果展示”和“2.视频效果展示”展示的系统图片或者视…...

【机器学习】决策树算法

目录 一、决策树算法的基本原理 二、决策树算法的关键概念 三、决策树算法的应用场景 四、决策树算法的优化策略 五、代码实现 代码解释&#xff1a; 在机器学习领域&#xff0c;决策树算法是一种简单直观且易于理解的分类和回归方法。它通过学习数据特征和决策规则&#…...

P2818 天使的起誓

天使的起誓 题目描述 Tenshi 非常幸运地被选为掌管智慧之匙的天使。在正式任职之前&#xff0c;她必须和其他新当选的天使一样要宣誓。 宣誓仪式是每位天使各自表述自己的使命&#xff0c;他们的发言稿放在 n n n 个呈圆形排列的宝盒中。这些宝盒按顺时针方向被编上号码 1…...

数字信号处理实验简介

数字信号处理(Digital Signal Processing,简称DSP)是电子工程、通信、计算机科学等领域中的一个重要分支,它涉及到对离散时间信号进行分析、处理和合成的理论和方法。数字信号处理课程的实验环节通常旨在帮助学生将理论知识应用于实际问题中,通过实践加深对DSP概念和技术的…...

Flask-SQLAlchemy 组件

一、ORM 要了解 ORM 首先了解以下概念。 什么是持久化 持久化 (Persistence)&#xff0c;即把数据&#xff08;如内存中的对象&#xff09;保存到可永久保存的存储设备中&#xff08;如磁盘&#xff09;。持久化的主要应用是将内存中的数据存储在关系型的数据库中&#xff0c;…...

Could not retrieve mirrorlist http://mirrorlist.centos.org错误解决方法

文章目录 背景解决方法 背景 今天在一台新服务器上安装nginx&#xff0c;在这个过程中需要安装相关依赖&#xff0c;在使用yum install命令时&#xff0c;发生了以下报错内容&#xff1a; Could not retrieve mirrorlist http://mirrorlist.centos.org/?release7&archx8…...

最新PHP网盘搜索引擎系统源码 附教程

最新PHP网盘搜索引擎系统源码 附教程&#xff0c;这是一个基于thinkphp5.1MySQL开发的网盘搜索引擎&#xff0c;可以批量导入各大网盘链接&#xff0c;例如百度网盘、阿里云盘、夸克网盘等。 功能特点&#xff1a;网盘失效检测&#xff0c;后台管理功能&#xff0c;网盘链接管…...

SpringBoot面试热题

1.Spring IOC(控制反转)和AOP(面相切面编程)的理解 控制反转意味着将对象的控制权从代码中转移到Spring IOC容器。 本来是我们自己手动new出来的对象&#xff0c;现在则把对象交给Spring的IOC容器管理&#xff0c;IOC容器作为一个对象工厂&#xff0c;管理对象的创建和依赖关系…...

ASP.NET Core8.0学习笔记(二十三)——EF Core自引用

一、什么是自引用 1.在常见的树状目录中&#xff0c;其结构如下&#xff1a; 每一个菜单可能有父级菜单&#xff0c;也可能有子菜单。但是无论是哪一级菜单&#xff0c;他们都是同属于菜单对象。将这个菜单对象使用代码进行描述&#xff1a; 在上面的代码中&#xff0c;主…...

springboot童装销售管理系统-计算机毕业设计源码92685

摘 要 童装销售管理系统是为童装店商家提供的在线销售管理系统&#xff0c;本系统的研发设计能够增加童装店商家的童装宣传和推广&#xff0c;提升客流量和订单量&#xff0c;增加商家的营业收益。原有的童装品销售系统管理采用手工管理的方式&#xff0c;各种童装品宣传和订单…...

OpenCV中的图像通道合并

在计算机视觉和图像处理领域&#xff0c;OpenCV是一个强大的工具库&#xff0c;它提供了从基本操作到复杂算法的广泛功能。今天&#xff0c;我们将通过一个简单的示例来探索OpenCV中的图像通道处理&#xff0c;特别是如何操作和理解BGR与RGB颜色空间的差异。 Lena图像&#xf…...

网站建设链接演示/东莞搜索优化

ssh -p2016 apache10.10.18.130 /bin/sh /data/www/vhosts/WOStest3_ENV/update_env.sh 需要设置shell远程免密码登录 转载于:https://www.cnblogs.com/ai594ai/p/7306402.html...

平阳县住房和城乡规划建设局网站/百度竞价推广怎么收费

复习一下基础DP&#xff0c;记忆化搜索 题意&#xff1a;给一个名字&#xff0c;和n*m矩阵&#xff0c;下面是矩阵信息&#xff0c;每次在一个格子&#xff0c;可以向上下左右移动&#xff0c;但是要求那个数字比当前所在格子数字小。可以从任意点出发&#xff0c;问最长的距离…...

wordpress 访问限制/域名批量查询工具

下面有这样一个场景&#xff1a; 数据库的某些字段是自增产生的&#xff08;比如说mysql&#xff0c;他就有自增的功能&#xff09; 我在插入数据的时候就没插入自增的那一段数据&#xff0c;但在插入数据后&#xff0c;我想看看自增的这条数据是什么&#xff08;回写操作&…...

个体工商户查询/百家港 seo服务

在项目中经常遇见这样的问题&#xff1a;修改应用的配置文件web.xml后&#xff0c;无论重启应用还是重启WebSphere服务器&#xff0c;都不能重新加载web.xml&#xff0c;导致修改的内容无效。 这个问题困扰了我好久&#xff0c;即使删除了${was安装目录}/IBM/WebSphere/AppServ…...

wordpress二级开发/东莞关键词排名提升

这题弄了两天才做出来&#xff0c;还是去请教了竹教主。 贴个别人的解说吧&#xff0c;自己懒得写了 把斐波那契数列转化为矩阵:A{1,1} {1,0}; {f[n1],f[n]} {f[n],f[n-1]} A^n ;最后输出右上角那项或者用{f[n2],f[n1]}{f[n1], f[n] } A^(n1); 最后输出右下角那项 我们用第…...

这几年做哪些网站致富/营销策划方案包括哪些内容

虽然现在jdk已经已经到了14【截至2020-08-15】&#xff0c;但是jdk8仍然是使用最广的版本&#xff0c;它的新特性不仅在我们日常开发中用到&#xff0c;在面试中也是一个经常被提问的点&#xff0c;所以对一些常用的还是需要知道的&#xff0c;我也只写一些常用的&#xff0c;有…...