解决Vue-cli npm run build生产环境打包,本地不能打开的问题


Posted in Javascript onSeptember 20, 2018

问题:

Tip: built files are meant to be served over an HTTP server.

Opening index.html over file:// won't work.

解释:

npm run dev是开发环境, npm run build是生产环境, 在开发环境完成代码和测试, 之后用生产环境生成代码,执行npm run build 命令后,会生成dist目录,里边包含index.html和static文件夹。

npm run build的时候, 一开始就会提示Built files are meant to be served over an HTTP server. Opening index.html over file:// won't work., 在vue-cli的默认配置中, 把assetsPublicPath: '/'改成assetsPublicPath: './',dist文件夹里的文件必须放在服务器的根目录, 如果你想本地打开的话, 可以在npm run build完成之后执行以下命令:

npm install -g http-server // 该命令只需执行一次, 安装过之后, 以后就不需要重复安装了.

以上这篇解决Vue-cli npm run build生产环境打包,本地不能打开的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JsRender for object语法简介
Oct 31 Javascript
Jquery 实现grid绑定模板
Jan 28 Javascript
js通过iframe加载外部网页的实现代码
Apr 05 Javascript
jQuery mobile类库使用时加载导航历史的方法简介
Dec 04 Javascript
jQuery动态创建元素以及追加节点的实现方法
Oct 20 Javascript
解决vue router使用 history 模式刷新后404问题
Jul 19 Javascript
Vue下滚动到页面底部无限加载数据的示例代码
Apr 22 Javascript
微信小程序冒泡事件及其阻止方法实例分析
Dec 06 Javascript
javascript面向对象三大特征之多态实例详解
Jul 24 Javascript
细说webpack6 Babel的使用详解
Sep 26 Javascript
vue渲染方式render和template的区别
Jun 05 Javascript
微信小程序整个页面的自动适应布局的实现
Jul 12 Javascript
jQuery 点击获取验证码按钮及倒计时功能
Sep 20 #jQuery
Vuex 快速入门(简单易懂)
Sep 20 #Javascript
vue项目打包部署_nginx代理访问方法详解
Sep 20 #Javascript
js计算两个日期间的天数月的实例代码
Sep 20 #Javascript
小程序scroll-view组件实现滚动的示例代码
Sep 20 #Javascript
详解swiper在vue中的应用(以3.0为例)
Sep 20 #Javascript
Vue框架里使用Swiper的方法示例
Sep 20 #Javascript
You might like
PHPWind 发帖回帖Api PHP版打包下载
2010/02/08 PHP
深入解析PHP内存管理之谁动了我的内存
2013/06/20 PHP
PHP和Shell实现检查SAMBA与NFS Server是否存在
2015/01/07 PHP
Yii2基于Ajax自动获取表单数据的方法
2016/08/10 PHP
php-7.3.6 编译安装过程
2020/02/11 PHP
PHP底层运行机制与工作原理详解
2020/07/31 PHP
如何做到打开一个页面,过几分钟自动转到另一页面
2007/04/20 Javascript
js下用gb2312编码解码实现方法
2009/12/31 Javascript
jQuery常见开发技巧详细整理
2013/01/02 Javascript
jQuery输入城市查看地图使用介绍
2013/05/08 Javascript
jQuery实现鼠标滚轮动态改变样式或效果
2015/01/05 Javascript
jQuery Form 表单提交插件之formSerialize,fieldSerialize,fieldValue,resetForm,clearForm,clearFields的应用
2016/01/23 Javascript
bootstrap fileinput 插件使用项目总结(经验)
2017/02/22 Javascript
vue2.0 资源文件assets和static的区别详解
2018/04/08 Javascript
详解ECMAScript typeof用法
2018/07/25 Javascript
Vue+Element UI+vue-quill-editor富文本编辑器及插入图片自定义
2019/08/20 Javascript
layui 图片上传+表单提交+ Spring MVC的实例
2019/09/21 Javascript
python笔记(1) 关于我们应不应该继续学习python
2012/10/24 Python
python 从远程服务器下载日志文件的程序
2013/02/10 Python
Django实现图片文字同时提交的方法
2015/05/26 Python
python登录豆瓣并发帖的方法
2015/07/08 Python
详解Python最长公共子串和最长公共子序列的实现
2018/07/07 Python
在python 中实现运行多条shell命令
2019/01/07 Python
Python标准库使用OrderedDict类的实例讲解
2019/02/14 Python
Flask项目中实现短信验证码和邮箱验证码功能
2019/12/05 Python
基于Python绘制个人足迹地图
2020/06/01 Python
Python Unittest原理及基本使用方法
2020/11/06 Python
5 分钟读懂Python 中的 Hook 钩子函数
2020/12/09 Python
Sneaker Studio法国:购买运动鞋
2018/06/08 全球购物
行政专员的岗位职责
2014/03/10 职场文书
期末个人总结范文
2015/02/13 职场文书
写给老婆的保证书
2015/02/27 职场文书
2015年精神文明建设工作总结
2015/04/21 职场文书
债务纠纷代理词
2015/05/25 职场文书
《爬天都峰》教学反思
2016/02/23 职场文书
pandas中DataFrame重置索引的几种方法
2021/05/24 Python