详解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 相关文章推荐
Aptana调试javascript图解教程
Nov 30 Javascript
JQuery自适应IFrame高度(支持嵌套 兼容IE,ff,safafi,chrome)
Mar 28 Javascript
jQuery参数列表集合
Apr 06 Javascript
捕获浏览器关闭、刷新事件不同情况下的处理方法
Jun 02 Javascript
jquery滚动加载数据的方法
Mar 09 Javascript
Javascript实现商品秒杀倒计时(时间与服务器时间同步)
Sep 16 Javascript
JS+Canvas绘制动态时钟效果
Nov 10 Javascript
vue jsx 使用指南及vue.js 使用jsx语法的方法
Nov 11 Javascript
微信web端后退强制刷新功能的实现代码
Mar 04 Javascript
Vue-cli项目获取本地json文件数据的实例
Mar 07 Javascript
angular 实时监听input框value值的变化触发函数方法
Aug 31 Javascript
Webpack4 使用Babel处理ES6语法的方法示例
Mar 07 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
第十四节--命名空间
2006/11/16 PHP
PHP创建word文档的方法(平台无关)
2016/03/29 PHP
Jquery实现弹出层分享微博插件具备动画效果
2013/04/03 Javascript
后台获取ZTREE选中节点的方法
2015/02/12 Javascript
javascript实现俄罗斯方块游戏的思路和方法
2015/04/27 Javascript
NodeJs——入门必看攻略
2016/06/27 NodeJs
Augularjs-起步详解
2016/07/08 Javascript
详解如何在React组件“外”使用父组件的Props
2018/01/12 Javascript
JS基于设计模式中的单例模式(Singleton)实现封装对数据增删改查功能
2018/02/06 Javascript
详解vue-loader在项目中是如何配置的
2018/06/04 Javascript
Vue实现调节窗口大小时触发事件动态调节更新组件尺寸的方法
2018/09/15 Javascript
WebGL three.js学习笔记之阴影与实现物体的动画效果
2019/04/25 Javascript
NodeJS http模块用法示例【创建web服务器/客户端】
2019/11/05 NodeJs
详解Vue+elementUI build打包部署后字体图标丢失问题
2020/07/13 Javascript
[02:28]DOTA2英雄基础教程 灰烬之灵
2013/12/19 DOTA
python处理圆角图片、圆形图片的例子
2014/04/25 Python
Python中Collections模块的Counter容器类使用教程
2016/05/31 Python
实例讲解Python中global语句下全局变量的值的修改
2016/06/16 Python
Python实现Kmeans聚类算法
2020/06/10 Python
浅析PHP与Python进行数据交互
2018/05/15 Python
浅谈python中np.array的shape( ,)与( ,1)的区别
2018/06/04 Python
flask入门之文件上传与邮件发送示例
2018/07/18 Python
Python切片操作去除字符串首尾的空格
2019/04/22 Python
对django views中 request, response的常用操作详解
2019/07/17 Python
解决在pycharm运行代码,调用CMD窗口的命令运行显示乱码问题
2019/08/23 Python
Python3.9最新版下载与安装图文教程详解(Windows系统为例)
2020/11/28 Python
购买澳大利亚最好的服装和内衣在线:BONDS
2016/10/14 全球购物
自荐信格式
2013/12/01 职场文书
数控专业自荐书范文
2014/03/16 职场文书
公司法定代表人授权委托书
2014/09/29 职场文书
学校元旦晚会开场白
2014/12/14 职场文书
务虚会发言材料
2014/12/25 职场文书
项目建议书
2015/02/04 职场文书
网络舆情信息简报
2015/07/21 职场文书
为Centos安装指定版本的Docker
2022/04/01 Servers
PostgreSQL并行计算算法及参数强制并行度设置方法
2022/04/06 PostgreSQL