vue项目，如何区分开发环境、测试环境、正式环境

9月前作者：八分钟de温暖分类：Toy博客阅读(42) 违法举报

这篇具有很好参考价值的文章主要介绍了vue项目，如何区分开发环境、测试环境、正式环境。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

一、通过哪个字段判断开发、测试、正式环境

process.env.NODE_ENV

二、怎么设置process.env.NODE_ENV的变量值

在package.json文件中配置

 "serve": "NODE_ENV=development vue-cli-service serve",
 "build:test": "NODE_ENV=test vue-cli-service build",
 "build": "NODE_ENV=production vue-cli-service build",

serve和build有默认值。默认值development 和 production

测试环境通常就是开发环境，所以设置为"build:test": “NODE_ENV=development vue-cli-service build”,

这是在MacOS操作系统中，但是在window系统中不起作用
window上会提示
vue项目，如何区分开发环境、测试环境、正式环境,vue.js,前端,javascript
vue如何配置研发/测试/生产环境?

不用配置文件，env中有两个默认字段 vue项目，如何区分开发环境、测试环境、正式环境,vue.js,前端,javascript

使用配置文件，可以任意添加字段
在项目根目录下添加配置文件

vue项目，如何区分开发环境、测试环境、正式环境,vue.js,前端,javascript
在编译时指定webpack的编译模式
文章来源地址https://www.toymoban.com/news/detail-805299.html

到了这里，关于vue项目，如何区分开发环境、测试环境、正式环境的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：如若内容造成侵权/违法违规/事实不符，请点击违法举报进行投诉反馈，一经查实，立即删除！

分享到：

领支付宝红包赞助服务器费用

vue项目(vue-cli)配置环境变量和打包时区分开发、测试、生产环境

在自定义配置Vue-cli 的过程中，想分别通过.env.development .env.test .env.production 来代表开发、测试、生产环境。本来想使用上面三种配置来区分三个环境，但是发现使用test来打包后在测试环境会报错，报错信息： Uncaught ReferenceError: exports is not defined 本来以为真的是程序出现什么

2023年04月08日
浏览(69)
js 通过 navigator.clipboard.writeText(textToCopy) 实现复制，测试环境可以，正式环境不行的解决方案。

问题描述：代码：测试环境下可以正常复制，但放到线上会报错：找不到 .writeText 百度分析：在 Chrome 的 DevTools 控制台下执行 navigator.clipboard 返回 undefined ，经查找资料发现是浏览器禁用了非安全域的 navigator.clipboard 对象，哪些地址是安全的呢？安全域包括本地访

2024年02月13日
浏览(38)
Vite+Vue3项目如何获取环境配置，并解决前端跨域问题

根目录新建.env.development和.env.production文件 package.json配置启动参数 vite命令启动项目时，指定mode参数，加载vite.config.ts文件。配置代理在vite.config.ts中配置代理配置vite-plugin-html 通过vite-plugin-html组件，可以将配置文件中的数据，绑定到index.html中，可以实现不同环境的页面ti

2024年02月19日
浏览(62)
搭建vue项目环境之二（完成基础环境的搭建之后开始正式安装）

由于工作太忙了，一直都是东奔西跑的，好多知识都是零散的，最近刚好有空，就计划利用这个空闲时间认真的整理以前学过的知识，帮助自己回顾过往，中间也难免有很多错误，欢迎指正挑刺。一直以来都是万金油，最后就是啥都会，但是也都是啥都会一点也都不

2024年02月11日
浏览(44)
vue项目发布有缓存，正式环境不更新（解决方案）

前言：每次测试构建或者打包更新版本发到服务器上，导致偶尔会出现不能及时更新到最新代码，浏览器存在缓存的问题。定义版本变量： const Version = new Date().getTime(); // 这里使用的是时间戳来区分，实际上不用加时间戳，webpack内部还自动变化hash值方法1、 Linux服务器设

2024年02月08日
浏览(40)
uniapp微信小程序区分正式版，开发版，体验版

小程序代码区分是正式版，开发版，还是体验版通常正式和开发环境需要调用不同域名接口，发布时需要手动更换或者有些东西不想在正式版显示，只在开发版体验版中显示，也需要去手动隐藏官方没有明确给出判断环境的方法，但其实是有的，也就是 __wxConfig 先看下 __

2024年02月12日
浏览(46)
Android网络安全配置network-security-config区分正式服和测试服

在Android开发中，为了帮助测试人员进行抓包，一般都会在Android的AndroidManifest.xml文件中配置network_security_config。不过，这也带来了一些安全性的问题，所以我们通常的策略是：线上的版本不支持抓包，测试版本支持抓包即可。为此，我们需要单独为正式服和测试服单独的进行

2024年02月17日
浏览(40)
web前端开发项目走proxy代理后端接口，构建发布到生产等环境后，如何修改api接口

在开发环境，因为本地站点和接口站点不是同一个域名，就产生了跨域问题，但是不可能让后端开发跨域端口或使用 jsonp ，所以，一般是让前端通过在 webpack.config.js 中配置 proxy 来走接口代理。代码如下：这样，就将本地域名代理到接口了。构建成 dist目录后，就不能修改

2024年02月15日
浏览(42)
前端配置开发环境，新电脑配置前端开发环境，Vue开发环境配置的详细过程（前端开发环境配置，电脑重置后配置前端开发环境）

简介：有时候，我们需要在新电脑或者电脑重置后，配置前端开发环境，具体都需要安装什么软件和插件，这里来记录一下（文章适合新手和小白，大佬可以带过）。 ✨前端开发环境，需要用到的软件和插件： Chrome Visual Studio Code（vscode） Node.js（npm / cnpm） Vue CLI （vue-

2024年03月19日
浏览(50)
前端开发 5: Vue.js 框架

在前端开发中，Vue.js 是一个流行且灵活的 JavaScript 框架，用于构建用户界面。它采用了组件化的开发方式，使得前端开发更加模块化和可维护。在本篇博客中，我将为你介绍 Vue.js 的基础知识和常用技巧，帮助你更好地掌握前端开发中的框架部分。 Vue.js 是一个轻量级的 Jav

2024年01月19日
浏览(43)