我们知道打包默认npm run build,可是打包后点击dist文件中index.html一片空白.问题在于路径问题。我们在工程文件的最外层增加文件.env.production这个文件就是这么奇怪。里边可以配置整个项目文件都可以访问的变量哦。看看里边我写的啥:(必须包含VUE_APP_)

在其他文件中引用

在package.json里配置打包

运行npm run build:production就可以了,本地就可以打开了。如果放在其他访问环境一样道理。

最后贴下我的项目文件:

vue-cli中process.env配置以及打包本地运行或者线上运行配置的更多相关文章

  1. vue cli中的env详解

    前言 相信使用过 vueCli 开发项目的小伙伴有点郁闷,正常开发时会有三个接口环境(开发,测试,正式),但是 vueCli 只提供了两种 development,production(不包含 tes ...

  2. @vue/cli 3.0 使用 svg-sprite-loader 加载本地 SVG 文件

    目录 @vue/cli 3.0 使用 svg-sprite-loader 加载本地 SVG 文件 运行 使用 配置 svg-sprite-loader 调用当前环境下的颜色 props @vue/cl ...

  3. FAT16/32不等于ESP:windows安装程序无法将windows配置为在此计算机的硬件上运行

    今天给公司电脑装系统,由于公司特殊需要,要给新电脑装win7系统.三台完全一样的华硕adol笔记本,前两台都和win10并存装成了双系统,第三台被不懂系统的人尝试装win7搞坏了,只能全盘格式化后再装 ...

  4. 本地数据库导入线上服务器的mongodb中

    更改默认端口 sudo vi /etc/mongod.conf 进入conf文件,修改port值为19999保存并退出. 重启mongodb sudo service mongod restart 进 ...

  5. Windows 安装程序无法将 Windows 配置为在此计算机的硬件上运行

    遇到这个问题是用辅助工具(WinNTSetup3.exe)进行的安装,重启后就就遇到“Windows 安装程序无法将 Windows 配置为在此计算机的硬件上运行” 解决:在WIN PE 下挂载安装光 ...

  6. windows安装程序无法将windows配置为在此计算机的硬件上运行

    关于装windows系统时,出现一些安装中断的处理 该方法适用于 windows安装程序无法将windows配置为在此计算机的硬件上运行 计算机意外地重新启动或遇到错误. Windows 安装无法继续 ...

  7. 快速解决:windows安装程序无法将windows配置为在此计算机的硬件上运行

    用手工运行msoobe.ext启用配置的方法, 快速解决:windows安装程序无法将windows配置为在此计算机的硬件上运行   我自己安装碰到的是蓝色这个错误,下面这个也有网友说用安装驱动等方法 ...

  8. vue cli 中关于vue.config.js中chainWebpack的配置

    Vue CLI  的官方文档上写:调整webpack配置最简单的方式就是在vue.config.js中的configureWebpack选项提供一个对象. Vue CLI 内部的 webpack 配置 ...

  9. axios踩坑记录+拦截器使用+vue cli代理跨域proxy+webpack打包部署到服务器

    1.小小的提一下vue cli脚手架前端调后端数据接口时候的本地代理跨域问题,如我在本地localhost访问接口http://40.00.100.100:3002/是要跨域的,相当于浏览器设置了一道 ...

随机推荐

  1. 解决mysql - 1577 问题

    背景:通过navicat连接mysql使用events时报如下错误 登录mysql查询event mysql> use zhk4; Database changed mysql> show ...

  2. Ubuntu配置SSH服务器

    SSH 为 Secure Shell 的缩写,由 IETF 的网络小组(Network Working Group)所制定:SSH 为建立在应用层和传输层基础上的安全协议.SSH 是目前较可靠,专为远 ...

  3. 剑指Offer(书):二叉树的下一个节点

    题目:给定一个二叉树和其中的一个结点,请找出中序遍历顺序的下一个结点并且返回.注意,树中的结点不仅包含左右子结点,同时包含指向父结点的指针. 分析:若一个节点有右子树,那么他的下一个节点就是他右子树中 ...

  4. [工具]Visual Studio

    1,Tab键的使用: 如不说有这样的代码:public Member member { get; set; } 当我们编辑完Member后,按一下Tab键,就能够将光标锁定到member上,等待键盘输 ...

  5. 洛谷 P3387 【模板】缩点 DAGdp学习记

    我们以洛谷P3387 [模板]缩点 来学习DAGdp 1.这道题的流程 //伪代码 for i->n if(i未被遍历) tarjan(i) 缩点() DAGdp() 完成 首先tarjan这部 ...

  6. spring boot学习02【如何在spring boot项目中访问jsp】

    1.配置application.properties文件 打开application.properties追加 spring.mvc.view.prefix=/WEB-ROOT/ spring.mvc ...

  7. C# 中的新增功能

    百度搜索:C# 中的新增功能 微软有站点专门介绍:C# 中的新增功能. 地址:https://docs.microsoft.com/zh-cn/dotnet/csharp/whats-new/inde ...

  8. .NET下 JSON 的一些常用操作

    1.JSON的序列化和反序列化 Newtonsoft.Json dll 下载地址http://json.codeplex.com/ using System; using System.Collect ...

  9. 动手实操:如何用 Python 实现人脸识别,证明这个杨幂是那个杨幂?

    当前,人脸识别应用于许多领域,如支付宝的用户认证,许多的能识别人心情的 AI,也就是人的面部表情,还有能分析人的年龄等等,而这里面有着许多的难度,在这里我想要分享的是一个利用七牛 SDK 简单的实现人 ...

  10. bzoj5108 [CodePlus2017]可做题 位运算dp+离散

    [CodePlus2017]可做题 Time Limit: 10 Sec  Memory Limit: 512 MBSubmit: 87  Solved: 63[Submit][Status][Dis ...