首页 > Web开发 > 详细

vue-webpack-simple模板build后图片加载问题

时间:2017-04-09 12:51:23      阅读:493      评论:0      收藏:0      [点我收藏+]

按照vuejs官方的脚手架生成了demo代码,并运行,步骤如下:

$ npm install -g vue-cli
$ vue init webpack-simple my-project
$ cd my-project
$ npm install
$ npm run dev

打开浏览器,可以看到demo的页面:

技术分享

此时打包后的build.js是在内存中的。如果要生成打包后的build.js需要执行下面的命令:

npm run build

想把打包后的build.js放到java web项目中的src目录下试着运行,html,js加载成功,页面能显示,但是图片没有显示出来,看了下图片的路径,在这里:

技术分享

技术分享

于是给项目中,增加了assets目录,把图片拷进去,重新执行,没有用。

技术分享

又看了下请求的url,发现图片的路径在dist路径下

Request URL:
http://localhost:8080/dist/logo.png?82b9c7a5a3f405032b1db71a25f67021

 重新拷贝图片到webapp目录下

技术分享

再次运行项目,图片加载成功!

vue-webpack-simple模板build后图片加载问题

原文:http://www.cnblogs.com/beilong/p/6684111.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!