vue开发环境和生产环境应用

最新推荐文章于 2023-03-05 15:08:55 发布
最新推荐文章于 2023-03-05 15:08:55 发布
阅读量821 收藏 1
点赞数
分类专栏： html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/xinxin_zhu/article/details/104694763
版权

1.需求 项目中经常会有线上线下接口地址 服务 内网 外网的区分,发布的时候改来改去很麻烦..有些不能统一配置的内网外网就引用的时候需要判断一下.

//process.env是全局配置的 可以在各个js 和vue 组件中使用

if (process.env.NODE_ENV === 'development') {  //开发环境   production  生产环境

  // 引用js 接口地址 ...

} else {

// 引用js 接口地址 ...

}

xinxin_zhu
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vue开发环境以及生产环境
04-11
打包了vue的开发环境以及生产环境。开发环境有详细的报错提示。生产环境更加友好。
vue环境搭建及目录结构分析
liucai1018的博客
09-16 1311
搭建vue开发环境： 1 安装Nodejs--见隔壁angular—https://blog.csdn.net/liucai1018/article/details/100877183 2 需要npm环境，安装了node就会自动安装npm了（查看版本:npm -v） 3设置npm镜像为淘宝镜像--由于node安装插件是从国外服务器下载，受网络影响大...
vue简介与环境搭建
jl15988
03-05 1110
nodejs、npm、vuejs简介，vue环境搭建
320、Vue学习笔记26 -【生产环境部署】 2020.04.20
youyouwuxin1234的博客
04-20 184
0、目录1、开启生产环境模式1.1 不使用构建工具1.2 使用构建工具2、模板预编译3、提取组件的 CSS4、跟踪运行时错误5、参考链接 1、开启生产环境模式 开发环境下，Vue 会提供很多警告来帮你对付常见的错误与陷阱。而在生产环境下，这些警告语句却没有用，反而会增加应用的体积。此外，有些警告检查还有一些小的运行时开销，这在生产环境模式下是可以避免的。 1.1 不使用构建工具 如果用 Vu...
Vue安装及环境配置、开发工具
热门推荐
dream_summer的博客
09-29 21万+
vue安装环境搭建 提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档 文章目录vue安装环境搭建前言一、node.js安装和配置1. 下载安装node.js2. 配置默认安装目录和缓存日志目录3. node.js环境配置4. 配置淘宝镜像源二、使用步骤1.引入库2.读入数据总结 前言 vue前端框架的环境搭建 一、node.js安装和配置 1. 下载安装node.js 官网下载最新版本：https://nodejs.org/en/download/ 可以下载安装包（安装教程见：http
详解Vue前端生产环境发布配置实战篇
11-28
但是在体验了几个demo的新鲜感之后，我们就要考虑如何把框架结合到我们实际的开发中如何应用的问题了。 下面我主要总结三个和生产发布相关的问题：资源文件发布文件夹配置，图片文件的引用，以及后台接口调试方法。 ...
Vuejs开发环境搭建及热更新【推荐】
12-03
相比于Angular.js，Vue.js提供了更加简洁、更易于理解的API，使得我们能够快速地上手并使用，特别适合单页应用的开发。 Vue.js是数据驱动的，它通过一些特殊的语法，将DOM和数据绑定起来，无需手动操作DOM。一旦创建...
vue-cli3 配置开发与测试环境详解
11-29
首先介绍一下本项目的背景，是基于 vue-cli3.1.1 的单页应用，目前测试环境和生产环境都在线上，并且都在同一个域名下，其中生产环境部署在根目录下，测试环境部署在名为 test 的子目录下，根据生产环境和测试环境的...
vue-element-admin:vue 开发模板
04-14
基于最新的vue开发堆栈，它具有内置的i18n解决方案，企业应用程序的典型模板以及许多出色的功能。 它可以帮助您构建大型而复杂的单页应用程序。 我相信无论您有什么需求，该项目都将为您提供帮助。 预习文献资料...
Vue.js devtools-用于调试Vue.js应用程序的Chrome devtools扩展。-Vue.js开发
05-27
devtools安装获取Chrome扩展/（beta通道）获取Firefox插件/（beta通道）获取独立的Electron应用程序（与任何vue-devtools安装一起使用）获取Chrome扩展/（beta通道）获取Firefox插件/（beta）通道）获取独立的...
vue页面中嵌入iframe外源地址页面 监听iframe 中事件
xinxin_zhu的博客
03-06 1万+
1.需求 vue中需要嵌入iframe 地址是第三方的 当iframeh中页面点击的时候.vue需要监控到这个事件将本页面关闭.代码中 js 发送和接收方法 //vue组件中是个弹框 <template> <el-dialog title="编辑" :visible.sync="editDialog" center :fullscreen="true" append-to-...
html页面跳转及回退的几种方式
xinxin_zhu的博客
03-06 4000
1.在页面里面跳转 比如有iframe 外壳 是在iframe 里面跳转 window.location.href="****" 回退用:window.history.back() 或者 window.history.go(-1) 2.基于浏览器的跳转 有外壳 可以直接跳出来 window.open("*******") 回退: window.open("about:blank", "...
Echarts之水滴球
xinxin_zhu的博客
12-06 1157
水滴球型图 注意：需要引用 echarts-liquidfill.js文件。 eg: html 文件头部需要引用js文件如下。 &lt;script src="js/jquery.js"&gt;&lt;/script&gt; &lt;script src="js/echarts.js"&gt;&lt;/script&gt; &lt;script src="js/echarts-li
vue 跨域配置
xinxin_zhu的博客
03-06 739
1.需求 vue项目中 有时候会遇到外源的地址 域名或端口 不一致 就会 跨域 配置.在vue.config.js(有的不是这个文件) 中配置 webpack-dev-server(可以找项目中这个的配置地方). 重要代码: proxy: { '/api':{ //代码加载的时候 用 /api 替换 target的地址 target:'http://...
Echarts之柱形图
xinxin_zhu的博客
12-07 312
需要引入  &lt;script src="js/jquery.js"&gt;&lt;/script&gt; &lt;script src="js/echarts.js"&gt;&lt;/script&gt; &lt;body&gt; &lt;div id="charts" style="min-width:150px;min-height:15
Echarts之饼图
xinxin_zhu的博客
12-07 290
引入jquery.js，echarts.js文件 &lt;script src="js/jquery.js"&gt;&lt;/script&gt; &lt;script src="js/echarts.js"&gt;&lt;/script&gt; &lt;body&gt; &lt;div id="charts" style="min-width:
infrared-remote-candroid studiodemo
最新发布
05-05
android studio下载
vue生产环境和开发环境配置
07-27
在Vue中，配置生产环境和开发环境的方法如下： 1. 开发环境配置： 在开发环境中，你可以使用Vue CLI提供的一些默认配置来方便地进行开发。你可以使用`vue create`命令创建一个新的Vue项目，然后在项目根目录下找到`.env.development`文件。在这个文件中，你可以设置一些开发环境的变量，比如API的地址等。例如： ``` VUE_APP_API_URL=http://localhost:8080/api ``` 你可以在你的代码中通过`process.env.VUE_APP_API_URL`来使用这个变量。 2. 生产环境配置： 在生产环境中，你需要对Vue应用进行一些优化和配置。同样，在项目根目录下找到`.env.production`文件，可以设置一些生产环境的变量。例如： ``` VUE_APP_API_URL=https://api.example.com ``` 同样，你可以在你的代码中通过`process.env.VUE_APP_API_URL`来使用这个变量。 此外，你还可以通过修改`vue.config.js`文件来进行更多的配置。比如，在生产环境中启用代码压缩和文件哈希等。 以上是基本的配置方法，具体的配置还取决于你的项目需求和开发环境。你可以根据需要进行进一步的配置和优化。

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值