webpack 打包vue

    忙忙碌碌的过了一个月的加班通宵的生活,这几天开始慢慢的有一点空了,就来赶紧更新文章。之前写过一篇文章是关于webpack 打包问题的,
但不知什么时候自己好像给误删了。不管了,就重新写一下吧。

1、关于打包配置

config/index.js

工程项目下config下的index.js 文件,找到下图中的属性


config/index.js
图中的红框的是静态文件的公共路径。如果你放在一个项目文件夹下,你的static文件夹在xxx文件夹下运行,那么你的文件路径就应改成   
 /xxx/  这样打包之后会显示文件的真是路径。

2、关于配置文件对了之后,仍出现路径不对的情况下。

(~~~我的项目都是真是好用的,具体需要大家实际情况而定,我这种情况是出现在使用 v-bind 中,对路径进行动态转换的时候。~~~)

下面是我的工程结构
工程结构

src/pages/qcList.vue
在开发环境下,图片都是正常加载的。但是当打包之后文件路径就会多出一个层级,后来研究发现,对于这种动态的路径,直接引用他的static 下的路径就完
全可以。如下图:
image.png
改成这样既可。此后在npm run build 就没问题了。

今天就先整理到这了。后续陆续跟新。一个小白在成长的路上不断成长,如有不足之处,敬请大家批评指正!!!

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容