Webpack中 publicPath 跟 path 的区别,个人理解

来源:互联网 发布:判断微信浏览器 js 编辑:程序博客网 时间:2024/05/17 22:32

正在初学Webpack,如有写错,各路大神留言指正。谢谢。


看了好几个publicPath 跟 path 的区别, 感觉还是不能理解。


结合了实际例子,为什么要加上publicPath。


在webpack打包过程中,原来的引用,例如,a.png会根据loader 设置,重新打包路径。 b.css引用了a.png


当其他CSS文件(即b.css)引用到这个png的时候,webpack是会自适应,在原引用位置重新分配路径。 这个时候没有任何错误。


可当webpack去打包CSS 文件时候呢?  如果放在dist (webpack output 设置目录)目录下面,也是没问题。


不过通常会又打包多一层,dist/css/   这个时候在b.css里面原来已经自适应好的路径好像就不对了。读取不到a.png。


这个时候就需要publicPath ,在a.png loader加上  publicPath : ../        。  ../代表了上一层的意思,如果css文件只打包了一层,等于回到了目标根目录。


这时候原来自适应号的a.png引用路径又对了。  同理,假如CSS文件被打包在  dist/css/ff/  下面, publicPath 应该就是  ../../  了


webpack也是有打包顺序的, 个人感觉是为了避免资源加载顺序,最后导致资源路径不对的一种补丁..


此是应用之一,不懂,我也初学,说错留言改正

原创粉丝点击