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 相关文章推荐
js过滤HTML标签以及空格的思路及代码
May 24 Javascript
jquery ready函数、css函数及text()使用示例
Sep 27 Javascript
js中判断用户输入的值是否为空的简单实例
Dec 23 Javascript
CSS3,HTML5和jQuery搜索框集锦
Dec 02 Javascript
AngularJS基础 ng-switch 指令简单示例
Aug 03 Javascript
jquery.validate表单验证插件使用方法解析
Nov 07 Javascript
JavaScript实现事件的中断传播和行为阻止方法示例
Jan 20 Javascript
使用Math.max,Math.min获取数组中的最值实例
Apr 25 Javascript
vue-cli项目中怎么使用mock数据
Sep 27 Javascript
vue.js通过路由实现经典的三栏布局实例代码
Jul 08 Javascript
详解easyui基于 layui.laydate日期扩展组件
Jul 18 Javascript
vscode+gulp轻松开发小程序的完整步骤
Oct 18 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
PHP面向对象教程之自定义类
2014/06/10 PHP
PHP答题类应用接口实例
2015/02/09 PHP
纯PHP代码实现支付宝批量付款
2015/12/24 PHP
详解PHP中array_rand函数的使用方法
2016/09/11 PHP
学习面向对象之面向对象的基本概念:对象和其他基本要素
2010/11/30 Javascript
javascript 折半查找字符在数组中的位置(有序列表)
2010/12/09 Javascript
基于jQuery实现的当离开页面时出现提示的实现代码
2011/06/27 Javascript
js汉字排序问题 支持中英文混排,兼容各浏览器,包括CHROME
2011/12/20 Javascript
JS之Date对象和获取系统当前时间详解
2014/01/13 Javascript
扒一扒JavaScript 预解释
2015/01/28 Javascript
jQuery实现html表格动态添加新行的方法
2015/05/28 Javascript
深入学习JavaScript对象
2015/10/13 Javascript
JavaScript函数节流概念与用法实例详解
2016/06/20 Javascript
JS+html5 canvas实现的简单绘制折线图效果示例
2017/03/13 Javascript
bootstrap daterangepicker双日历时间段选择控件详解
2017/06/15 Javascript
Vue-Router的使用方法
2018/09/05 Javascript
extjs图表绘制之条形图实现方法分析
2020/03/06 Javascript
儿童学习python的一些小技巧
2018/05/27 Python
Python Socket编程之多线程聊天室
2018/07/28 Python
python 分离文件名和路径以及分离文件名和后缀的方法
2018/10/21 Python
Pycharm更换python解释器的方法
2018/10/29 Python
python3正则提取字符串里的中文实例
2019/01/31 Python
python 实现单通道转3通道
2019/12/03 Python
Python 寻找局部最高点的实现
2019/12/05 Python
使用K.function()调试keras操作
2020/06/17 Python
CSS3实现点击放大的动画实例代码
2017/02/27 HTML / CSS
简述DNS进行域名解析的过程
2013/12/02 面试题
万年牢教学反思
2014/02/15 职场文书
ktv周年庆活动方案
2014/08/18 职场文书
4s店活动策划方案
2014/08/25 职场文书
计算机科学与技术专业求职信
2014/09/03 职场文书
教师批评与自我批评
2014/10/15 职场文书
出差报告格式模板
2014/11/06 职场文书
2014年客房部工作总结
2014/11/22 职场文书
寒假致家长的一封信
2015/10/10 职场文书
Django使用echarts进行可视化展示的实践
2021/06/10 Python