vue2设置当前环境 判断当前环境

最新推荐文章于 2024-05-21 20:04:34 发布
最新推荐文章于 2024-05-21 20:04:34 发布
阅读量740 收藏
点赞数
分类专栏： vue 文章标签： vue.js 前端 javascript
Lcc
本文链接：https://blog.csdn.net/weixin_50601484/article/details/129579112
版权

新建两个环境文件 .env.dev（开发） .env.pro（生产）
开发内容为：
NODE_ENV=‘dev’
VUE_APP_URL=‘https/dev’
值不相同即可
指令描述
“serve”: “vue-cli-service serve --mode dev”,
“dev”: “vue-cli-service serve --mode dev”,
“build”: “vue-cli-service build --mode pro”,
不同运行指令 运行不同文件

重新运行获取 process.env.NODE_ENV
判断process.env.NODE_ENV === ‘dev’ 即可判断是否为开发环境

无恃而安
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vue3.0环境变量配置.md
04-08
vue3.0环境变量配置大致思路： 1，创建修改相关配置文件（Ctrl + C V即可） 2，封装 axios（根据配置文件，首先判断当前环境，获取对应环境的数据库地址作为当前环境下的基础地址，**拼接到** axios 里面的 url ） 3，模块化开发 4，使用插件对代码进行测试判断环境配置是否成功
vue离开当前页面触发的函数代码
10-14
主要介绍了vue离开当前页面触发的函数代码，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
VueJs各个版本— 判断当前是开发、生产环境
No_Name_Cao_Ni_Mei的博客
11-03 1989
现存的vue项目可分为VueCLI2 创建的项目Vue CLI 3 和 Vue CLI 4 创建的项目下面就讲讲各个环境创建下的开发和生产环境如何判断。
vue - vue的index.html中获取环境变量和业务判断
qq_43886365的博客
04-20 6735
vue的index.html中获取环境变量和业务判断
vue3判断当前的环境变量, 获取环境变量中的值
reembarkation的博客
01-30 1162
vue3判断当前的环境变量, 获取环境变量中的值
[配置]VUE中通过process.env判断开发，测试和生产环境，并分环境配置不同的URL HOST
热门推荐
tom_wong666
05-02 2万+
需求： VUE开发前端项目，需要分环境配置URL和做相关处理 思路：通过process.env做判断和处理 实现一：环境区分 1，找到项目配置文件夹： config文件夹 2，进入如下三个文件： dev.env.js 对应开发环境 test.env.js 对应测试环境 prod.env.js 对应生产环境 找到如下代码： // 开发环境 module.exports = merge(prodEn...
vue如何判断项目是开发环境还是线上环境或者本地环境
Mygongzi的博客
09-02 8079
vue如何判断项目是开发环境还是线上环境或者本地环境
【vue】配置webpack中dev.env.js、prod.env.js，解决不同命令下项目启动和打包到指定的环境
qq_26780317的博客
08-25 1万+
背景：在前后端分离开发的项目中，一般会有开发环境、测试环境、预上线环境和生产环境。 1.在开发环境下调试接口的时候，一般都会有好几个接口地址，需要根据情况手动来切换接口地址； 2.打包时要部署项目到不同的环境，而这也需要每次都根据情况切换接口地址。 虽然，手动切换地址可以满足需求，但是这种方式不是一种较为便捷的处理方式。我们可以选择一种较为方便的方式来解决这个问题。 ...
vue配置不同命令区分测试环境和生产环境
qq_43364234的博客
12-16 5560
在项目开发过程中，往往会区分出测试环境和线上环境，这里记录一下在使用vue进行开发的时候通过不同的打包指令区分测试和线上环境。 首先我们需要安装cross-env npm i --save-dev cross-env 然后修改package.json文件 "scripts": { "dev": "webpack-dev-server --inline --progress --confi...
vue cli3 区分开发环境，测试环境，正式环境
qq_40291247的博客
12-31 1756
在根目录下新建 .env.xx (xx可以是自己取的用来区分这三个环境） // 如： env.development // 开发 env.beta // 测试 env.production // 正式 编辑新建的文件 注意：全局变量仅除NODE_ENV和BASE_URL这两个保留变量外，其余自定义变量都需使用VUE_APP开头。 .env文件里不允许存在注释 （这里只为了大家更好的阅读理解） // env.development NODE_ENV = 'development' VUE_.
基于VUE实现判断设备是PC还是移动端
10-15
主要介绍了基于VUE实现判断设备是PC还是移动端,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
vue获取当前激活路由的方法
11-28
一个 route object（路由信息对象） 表示当前激活的路由的状态信息，包含了当前 URL 解析得到的信息，还有 URL 匹配到的 route records（路由记录）。 route object 是 immutable（不可变） 的，每次成功的导航后...
vue 判断元素内容是否超过宽度的方式
10-15
主要介绍了vue 判断元素内容是否超过宽度的方式，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
vue 发布时区分环境
JankoY的博客
11-09 1348
1、通过vue构建 1.vue-cli-service server // 环境默认为‘developement’ vue-cli-service build 2.vue-cli-service build // 环境默认为‘production’ vue-cli-service build 3.通过.env识别环境 // 环境默认为‘production’ .env // 全局默认环境 .env.developement //开发环境 .env.production//生产环境 // .en
vue、vue.cli配置不同命令区分测试环境、生产环境和开发环境
amy_victory的博客
01-12 2709
在看了众多文档后，选择了认为最简单地配置方法。 1、首先在config文件夹下创建三个文件dev.env.js(开发环境)、test.env.js(测试环境)、pro.env.js(生产环境）。 dev.env.js(开发环境)文件内容如下： // 开发环境 module.exports = { NODE_ENV: '"development"', URL_RSP: 'http://xxx.xxx.xxx.xxx:xxxx',//开发环境下的接口地址，如果有多个地址可以写如下
vue vite项目区分 development和production 环境
qq_40287084的博客
03-27 3340
vite vue 区分 development和production 环境
vue配置webpack生产环境.env.production、测试环境.env.development(配置不同环境的打包访问地址)
见贤思齐焉，见不贤内自省
12-27 4873
vue配置webpack生产环境.env.production、测试环境.env.development(配置不同环境的打包访问地址)
vue配置dev、test、pro环境，实现分环境打包
weixin_46192027的博客
08-24 5624
vue配置dev、test、pro环境，实现分环境打包 使用vue-cli开发项目时，默认自带的环境有development（开发环境）、production（生产环境），在最近开发的一个项目中，后端是由.net和java共同开发的，为了适应和提高多环境多域名的打包配置效率，前端需要分环境配置不同的打包命令；下面就来讲讲如何配置test环境，实现测试环境的一键打包命令：npm run test。 1、package.json文件中新增命令行脚本test命令,并指向build文件夹下的test.js。 2、
基于vuestic-ui实战教程 - 页面篇
最新发布
PleaseBeStrong的博客
05-21 959
原有的table组件不够美观，想要自己定义的时候就可以用该模板，对于模板的实例如上图我用红色框框框出来的就是几个加入的组件，下面就分别在代码中实现上面的代码中提到了特别多的类型比如UserData 、Pagination 、Sorting 等等，下面就给出这些类型的定义（如下代码定义在api/system/sysUser/types.ts 中）前面两个完全根据后端的实体类对应，而下面三个就是渲染所需要用到的一些类型定义/* sysUser参数类型 *//* sysUser参数类型*/
vue判断当前环境
05-26
在Vue中，可以使用`process.env.NODE_ENV`来判断当前环境。通常情况下，我们可以将开发环境、测试环境和生产环境分别设置不同的值。 例如，我们可以在`.env.development`文件中设置`NODE_ENV=development`，在`.env.test`文件中设置`NODE_ENV=test`，在`.env.production`文件中设置`NODE_ENV=production`。 然后，在Vue代码中就可以使用以下方式来判断当前环境： ```javascript if (process.env.NODE_ENV === 'development') { // 开发环境下的代码 } else if (process.env.NODE_ENV === 'test') { // 测试环境下的代码 } else if (process.env.NODE_ENV === 'production') { // 生产环境下的代码 } ``` 注意，需要在使用`process.env.NODE_ENV`之前，先安装`dotenv`或`@vue/cli-plugin-dotenv`插件，并且在项目根目录下添加相应的`.env`文件。

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值