vue生成文件本地打开查看效果的实例


Posted in Javascript onSeptember 06, 2018

问题描述:

npm run build 后dist文件夹下面直接浏览器打开index.html,css和js的路径都不正确。 放到跟目录下就正常了。

问题解决:

打开项目所在文件夹里面的 config - index.js

vue生成文件本地打开查看效果的实例

在 build 部分的 assetsPublicPath 里面加一个点即可

assetsPublicPath: '/',

改为

assetsPublicPath: './',

解释:

将绝对路径改为相对路径(解释有点不对,凑合着理解吧)

延伸:

这么做的效果主要影响的是 项目所在文件夹里面的 build- webpack.base.conf.js

vue生成文件本地打开查看效果的实例

效果相当于:

output: {
 path: config.build.assetsRoot,
 filename: '[name].js',
 publicPath: process.env.NODE_ENV === 'production'
  ? config.build.assetsPublicPath
  : config.dev.assetsPublicPath
 },

改为了:

output: {
 path: config.build.assetsRoot,
 filename: '[name].js',
 publicPath: process.env.NODE_ENV === 'production'
  ? './'
  : config.dev.assetsPublicPath
 },

以上这篇vue生成文件本地打开查看效果的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript 设计模式之组合模式解析
Apr 09 Javascript
javascript开发技术大全-第1章javascript概述
Jul 03 Javascript
json2.js的初步学习与了解
Oct 06 Javascript
JavaScript中__proto__与prototype的关系深入理解
Dec 04 Javascript
javascript页面加载完执行事件代码
Feb 11 Javascript
jQuery1.9.1针对checkbox的调整方法(prop)
May 01 Javascript
jQuery基于正则表达式的表单验证功能示例
Jan 21 Javascript
jquery easyui DataGrid简单示例
Jan 23 Javascript
Vue实现搜索结果高亮显示关键字
May 28 Javascript
微信小程序实现点击空白隐藏的方法示例
Aug 13 Javascript
6种JavaScript继承方式及优缺点(小结)
Feb 06 Javascript
ElementUI实现el-form表单重置功能按钮
Jul 21 Javascript
vuejs实现折叠面板展开收缩动画效果
Sep 06 #Javascript
在vue中读取本地Json文件的方法
Sep 06 #Javascript
浅谈Vue render函数在ElementUi中的应用
Sep 06 #Javascript
解决vue同一slot在组件中渲染多次的问题
Sep 06 #Javascript
vue template中slot-scope/scope的使用方法
Sep 06 #Javascript
vue-cli 默认路由再子路由选中下的选中状态问题及解决代码
Sep 06 #Javascript
jQuery实现鼠标移入移出事件切换功能示例
Sep 06 #jQuery
You might like
Zend Studio for Eclipse的java.lang.NullPointerException错误的解决方法
2008/12/06 PHP
php json_encode奇怪问题说明
2011/09/27 PHP
php制作文本式留言板
2015/03/18 PHP
PHP加密解密字符串汇总
2015/04/26 PHP
老版本PHP转义Json里的特殊字符的函数
2015/06/08 PHP
php使用COPY函数更新配置文件的方法
2015/06/18 PHP
php通过各种函数判断0和空
2020/07/04 PHP
JavaScript学习笔记之JS对象
2015/01/22 Javascript
即将发布的jQuery 3 有哪些新特性
2016/04/14 Javascript
KVM虚拟化技术之使用Qemu-kvm创建和管理虚拟机的方法
2016/10/05 Javascript
AngularJS框架的ng-app指令与自动加载实现方法分析
2017/01/04 Javascript
移动端web滚动分页的实现方法
2017/05/05 Javascript
JS实现小球的弹性碰撞效果
2017/11/11 Javascript
详解Vue中使用Axios拦截器
2019/04/22 Javascript
Android 自定义view仿微信相机单击拍照长按录视频按钮
2019/07/19 Javascript
vue.js实现回到顶部动画效果
2019/07/31 Javascript
d3.js实现图形缩放平移
2019/12/19 Javascript
python代码实现ID3决策树算法
2017/12/20 Python
Python使用folium excel绘制point
2019/01/03 Python
python实现两个经纬度点之间的距离和方位角的方法
2019/07/05 Python
python根据文本生成词云图代码实例
2019/11/15 Python
python3连接MySQL8.0的两种方式
2020/02/17 Python
matlab中imadjust函数的作用及应用举例
2020/02/27 Python
求最大连续递增数字串(如"ads3sl456789DF3456ld345AA"中的"456789")
2015/09/11 面试题
优秀的茶餐厅创业计划书
2014/01/03 职场文书
《诚实与信任》教学反思
2014/04/10 职场文书
英语系本科生求职信
2014/07/15 职场文书
干部个人对照检查材料
2014/08/25 职场文书
党的群众路线教育实践活动个人批评与自我批评
2014/10/16 职场文书
2014年英语教学工作总结
2014/12/17 职场文书
授权委托书
2015/01/28 职场文书
2015年度护士个人工作总结
2015/04/09 职场文书
竞聘开场白方式有哪些?
2019/08/28 职场文书
python中pandas对多列进行分组统计的实现
2021/06/18 Python
俄罗斯十大城市人口排名,第三首都仅排第六,第二是北方首都
2022/03/20 杂记
Python OpenCV形态学运算示例详解
2022/04/07 Python