详解vue项目打包步骤


Posted in Javascript onMarch 29, 2019

终端运行命令 npm run build

打包成功的标志与项目的改变,如下图:

详解vue项目打包步骤

详解vue项目打包步骤

 点击index.html,通过浏览器运行,出现以下报错,如图:

详解vue项目打包步骤

那么应该如何修改呢?

具体步骤如下:

  1. 1、查看package.js文件的scripts命令
  2. 2、打开webpack.dev.conf.js文件,找到publicPath: config.dev.assetsPublicPath,按Ctrl点击,跳转到index.js文件
  3. 3、其中dev是开发环境,build是构建版本,找到build下面的assetsPublicPath: '/',然后修改为assetsPublicPath: './',即“/”前加点。
  4. 4、终端运行 npm run build 即可。

此时点击index.html,通过浏览器运行便,会发现动态绑定的static的图片找不到,故static必须使用绝对路径。将图片路径修改为绝对路径,至此,打包完成。

以上所述是小编给大家介绍的vue项目打包步骤详解整合,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
几个javascript操作word的参考代码
Oct 26 Javascript
关于js拖拽上传 [一个拖拽上传修改头像的流程]
Jul 13 Javascript
js 取时间差去掉周六周日实现代码
Dec 25 Javascript
JavaScript 模拟类机制及私有变量的方法及思路
Jul 10 Javascript
浅谈jQuery中的checkbox问题
Aug 10 Javascript
javascript滚轮事件基础实例讲解(37)
Feb 14 Javascript
Node.js如何实现注册邮箱激活功能 (常见)
Jul 23 Javascript
关于vue v-for循环解决img标签的src动态绑定问题
Sep 18 Javascript
让webpack+vue-cil项目不再自动打开浏览器的方法
Sep 27 Javascript
Vue 报错TypeError: this.$set is not a function 的解决方法
Dec 17 Javascript
微信小程序以ssm做后台开发的实现示例
Apr 08 Javascript
vue 动态设置img的src地址无效,npm run build 后找不到文件的解决
Jul 26 Javascript
jQuery实现动态添加和删除input框代码实例
Mar 29 #jQuery
Vue项目history模式下微信分享爬坑总结
Mar 29 #Javascript
vue中使用微信公众号js-sdk踩坑记录
Mar 29 #Javascript
微信小程序学习笔记之本地数据缓存功能详解
Mar 29 #Javascript
微信JS-SDK updateAppMessageShareData安卓不能自定义分享详解
Mar 29 #Javascript
详解vue配置后台接口方式
Mar 29 #Javascript
微信小程序学习笔记之获取位置信息操作图文详解
Mar 29 #Javascript
You might like
2014年10个最佳的PHP图像操作库
2014/07/14 PHP
PHP实现自动识别Restful API的返回内容类型
2015/02/07 PHP
CI框架数据库查询缓存优化的方法
2016/11/21 PHP
实现连缀调用的map方法(prototype)
2009/08/05 Javascript
js中小数转换整数的方法
2014/01/26 Javascript
自定义百度分享的分享按钮
2015/03/18 Javascript
JS实现弹出浮动窗口(支持鼠标拖动和关闭)实例详解
2015/08/06 Javascript
全面解析Bootstrap中Carousel轮播的使用方法
2016/06/13 Javascript
javaScript生成支持中文带logo的二维码(jquery.qrcode.js)
2017/01/03 Javascript
微信小程序城市定位的实现实例(获取当前所在国家城市信息)
2017/05/17 Javascript
Node.js如何使用Diffie-Hellman密钥交换算法详解
2017/09/05 Javascript
Node调用Java的示例代码
2017/09/20 Javascript
Vue响应式原理深入解析及注意事项
2017/12/11 Javascript
移动端自适应flexible.js的使用方法(不用三大框架,仅写一个单html页面使用)推荐
2019/04/02 Javascript
Vue2(三)实现子菜单展开收缩,带动画效果实现方法
2019/04/28 Javascript
js prototype深入理解及应用实例分析
2019/11/25 Javascript
Vue如何基于vue-i18n实现多国语言兼容
2020/07/17 Javascript
Python 文件操作实现代码
2009/10/07 Python
python调用短信猫控件实现发短信功能实例
2014/07/04 Python
python字符串str和字节数组相互转化方法
2017/03/18 Python
详解python之配置日志的几种方式
2017/05/22 Python
python定时按日期备份MySQL数据并压缩
2019/04/19 Python
python django生成迁移文件的实例
2019/08/31 Python
python logging日志模块原理及操作解析
2019/10/12 Python
Python Sphinx使用实例及问题解决
2020/01/17 Python
Python unittest生成测试报告过程解析
2020/09/08 Python
演讲稿怎么写才完美
2014/01/02 职场文书
采购助理岗位职责
2014/02/16 职场文书
家长对孩子的感言
2014/03/10 职场文书
大学生入党积极分子自我评价
2014/09/20 职场文书
党员教师个人对照检查材料(群众路线)
2014/09/26 职场文书
庆祝新中国成立65周年“向国旗敬礼”网上签名寄语
2014/09/27 职场文书
2015年学生会干事工作总结
2015/04/09 职场文书
学校禁毒宣传活动总结
2015/05/08 职场文书
网吧管理制度范本
2015/08/05 职场文书
职场:企业印章管理制度(模板)
2019/10/18 职场文书