我们知道打包默认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. Cycloid Hydraulic Motor Use: Use Failure And Treatment

    The cycloidal hydraulic motor is a small low-speed, high-torque hydraulic motor with a shaft-distrib ...

  2. 数论基础之组合数&计数问题

    一.组合数:问题引入:现在有 n 个球,取其中的 k 个球,问一共有多少种方式?答案: 公式直观解释:我们考虑有顺序地取出 k 个球:第一次有 n 种选择,第二次有 n-1 种选择,...,第 k 次 ...

  3. Hibernate的核心配置

    Hibernate的设计思路 Hibernate是一种全自动化管理持久化对象的ORM框架,既提供了完全面向对象的封装完整的对象持久化接口(屏蔽db层的差异化,提升代码可移植性),也提供了操作HQL和S ...

  4. “打开ftp服务器上的文件夹时发生错误，请检查是否有权限访问该文件夹"

    阿里云虚拟主机上传网站程序 问题场景:网页制作完成后,程序需上传至虚拟主机 注意事项: 1.Windows系统的主机请将全部网页文件直接上传到FTP根目录,即 / . 2. 如果网页文件较多,上传较慢 ...

  5. (13) openssl ca(签署和自建CA)

    用于签署证书请求.生成吊销列表CRL以及维护已颁发证书列表和这些证书状态的数据库.因为一般人无需管理crl,所以本文只介绍openssl ca关于证书管理方面的功能. 证书请求文件使用CA的私钥签署之 ...

  6. 聊聊svg

    来源:SVG的用法 补充 CANVAS产生的dom数量比SVG要少 SVG可以使用css设置动画样式 对于动画性能来说,不能说svg或canvas谁更优,而是要看情况: SVG 是一种使用 XML 描 ...

  7. Restful API(转)

    原文链接 http://www.ruanyifeng.com/blog/2014/05/restful_api.html 一.协议 API与用户的通信协议,总是使用HTTPs协议. 二.域名 应该尽量 ...

  8. Activiti数据表

    --1:资源库流程规则表SELECT * FROM JEESITE.act_re_deployment --部署信息表SELECT * FROM JEESITE.act_re_model --流程设计 ...

  9. Java基础学习总结（94）——Java线程再学习

    Java线程有哪些不太为人所知的技巧与用法? 萝卜白菜各有所爱.像我就喜欢Java.学无止境,这也是我喜欢它的一个原因.日常工作中你所用到的工具,通常都有些你从来没有了解过的东西,比方说某个方法或者是 ...

  10. python接口自动化-有token的接口项目使用unittest框架设计

    获取token 在做接口自动化的时候,经常会遇到多个用例需要用同一个参数token,并且这些测试用例跨.py脚本了. 一般token只需要获取一次就行了,然后其它使用unittest框架的测试用例全部 ...