当前位置: 首页 > 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.视频效果展示”展示的系统图片或者视…...

Phi-3-mini-128k-instruct与STM32开发:生成嵌入式C代码与调试逻辑

Phi-3-mini-128k-instruct与STM32开发&#xff1a;生成嵌入式C代码与调试逻辑 1. 引言 如果你玩过STM32&#xff0c;尤其是像STM32F103C8T6这种经典的“蓝色药丸”最小系统板&#xff0c;肯定对下面这些场景不陌生&#xff1a;为了点亮一个LED&#xff0c;翻遍数据手册&#…...

Materials Studio8.0在CentOS7.9环境下的安装与配置指南

1. 环境准备与系统检查 在CentOS 7.9上安装Materials Studio 8.0之前&#xff0c;我们需要确保系统环境满足最低要求。我遇到过不少因为环境配置不当导致的安装失败案例&#xff0c;这里分享几个关键检查点&#xff1a; 首先检查主机名是否包含特殊字符。Materials Studio对主机…...

实时交易系统架构设计:从事件驱动到向量化框架的终极指南

实时交易系统架构设计&#xff1a;从事件驱动到向量化框架的终极指南 【免费下载链接】awesome-systematic-trading A curated list of insanely awesome libraries, packages and resources for systematic trading. Crypto, Stock, Futures, Options, CFDs, FX, and more | 量…...

文件上传进阶:PHP Graph SDK多媒体处理与分块上传教程

文件上传进阶&#xff1a;PHP Graph SDK多媒体处理与分块上传教程 【免费下载链接】php-graph-sdk The Facebook SDK for PHP provides a native interface to the Graph API and Facebook Login. https://developers.facebook.com/docs/php 项目地址: https://gitcode.com/g…...

DeepSeek-R1-Distill-Qwen-1.5B响应慢?函数调用优化实战解决方案

DeepSeek-R1-Distill-Qwen-1.5B响应慢&#xff1f;函数调用优化实战解决方案 你是不是也遇到过这种情况&#xff1a;好不容易在本地部署了DeepSeek-R1-Distill-Qwen-1.5B这个“小钢炮”模型&#xff0c;结果发现函数调用时响应特别慢&#xff1f;明明官方说RTX 3060能跑200 to…...

将 OnePlus 手机备份到云服务

丢失 OnePlus 设备上的珍贵照片、重要联系人、短信或应用数据可能会令人非常沮丧&#xff0c;无论是意外删除、设备损坏、被盗&#xff0c;甚至是恢复出厂设置。这时&#xff0c;云备份就派上了用场。它提供了一种简单可靠的数据保护方式&#xff0c;确保您可以随时随地在新 On…...

使用 HashMap 优化嵌套循环:Java 对象数组转换

本文旨在提供使用 HashMap 优化 Java 嵌套循环的有效方法&#xff0c;特别是当循环涉及对象数组并进行相等检查时。通过将内部循环转换为 HashMap 查询可以显著降低时间复杂性&#xff0c;提高代码性能。本文将提供详细的步骤和示例代码&#xff0c;以帮助读者理解和应用此优化…...

高效管理惠普OMEN游戏本:OmenSuperHub全面解析与实战指南

高效管理惠普OMEN游戏本&#xff1a;OmenSuperHub全面解析与实战指南 【免费下载链接】OmenSuperHub 项目地址: https://gitcode.com/gh_mirrors/om/OmenSuperHub OmenSuperHub是一款专为惠普OMEN系列游戏本设计的轻量级系统管理工具&#xff0c;它通过替代原厂Omen Ga…...

PDF24 Creator离线版隐藏技巧:5个连官网都没说的自动化妙用

PDF24 Creator离线版隐藏技巧&#xff1a;5个连官网都没说的自动化妙用 如果你经常需要处理PDF文档&#xff0c;可能已经听说过PDF24 Creator这款免费工具。但大多数人仅仅停留在基础功能的使用上&#xff0c;比如简单的PDF合并、分割或转换。今天我要分享的是PDF24 Creator离线…...

pykg2vec功能mastery:知识图谱嵌入模型的高级配置与优化

pykg2vec功能mastery&#xff1a;知识图谱嵌入模型的高级配置与优化 【免费下载链接】pykg2vec 项目地址: https://gitcode.com/gh_mirrors/py/pykg2vec 问题导入 知识图谱嵌入模型训练中&#xff0c;开发者常面临三大痛点&#xff1a;模型参数调优耗时且效果不佳、不…...