webpack学习教程之publicPath路径问题详解
更新时间：2017年06月17日 11:18:57 作者：心悦诚服555
这篇文章主要给大家介绍了webpack学习教程之publicPath路径问题的相关资料，文中通过示例代码介绍的非常详细，对大家具有一定的参考学习价值，需要的朋友们下面来一起看看吧。
本文主要给大家介绍了关于webpack中publicPath路径问题的相关内容，分享出来供大家参考学习，下面来看看详细的介绍：
output: {
filename: "[name].js",
path:path.resolve(__dirname,"build")
}
如果没有指定pubicPath,则引入路径如下
<body> <script src="b.js"></script> </body>
如果有指定publicPath
output: {
filename: "[name].js",
path:path.resolve(__dirname,"build"),
publicPath:"/assets/"
}
则引入如下
<body> <script src="assets/b.js"></script> </body>
webpack-dev-server环境下，path、publicPath、区别与联系
path：指定编译目录而已（/build/js/），不能用于html中的js引用。
publicPath：虚拟目录，自动指向path编译目录（/assets/ => /build/js/）。html中引用js文件时，必须引用此虚拟路径（但实际上引用的是内存中的文件，既不是/build/js/也不是/assets/）。
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
发布至生产环境：
1.webpack进行编译（当然是编译到/build/js/）
2.把编译目录（/build/js/）下的文件，全部复制到/assets/目录下（注意：不是去修改index.html中引用bundle.js的路径）
之前因为publicPath的路径错误原因，导致webpack-dev-server不能自动刷新
总结
以上就是这文章的全部内容了，希望本文的内容对大家的学习或者工作能带来一定的帮助，如有疑问大家可以留言交流，谢谢大家对脚本之家的支持。
相关文章
根据新界面的要求，需要一部分图片来增强日期控件的美观性。考虑到既要实现加载图表的目标，又要保持控件的独立性以便将来的移植。2010-09-09
在开发过程中，为了应对多变的复杂场景，我们需要了解一下 TypeScript 的高级类型。本文就为大家整理了一些需要掌握的TypeScript高级类型，需要的可以参考一下2022-08-08
最近开发微信小程序进入到支付阶段，一直以来从事App开发，所以支付流程还是熟记于心的。下面通过本文给大家讲述下微信小程序进行微信支付的步骤,需要的朋友可以参考下2016-12-12
本章节介绍一下如何实现未知宽高的元素在指定元素下实现垂直水平居中效果，代码简单易懂，需要的朋友可以参考下本文2015-09-09
下面小编就为大家带来一篇js中class的点击事件没有效果的解决方法。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2016-10-10
在本篇文章里小编给大家整理的是关于js的新生代垃圾回收的相关知识点内容，有需要的朋友们可以参考学习下。2019-08-08
下面小编就为大家带来一篇信息滚动效果的实例讲解。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-09-09
javaScript+turn.js实现图书翻页效果实例代码
这篇文章主要介绍了javaScript+turn.js实现图书翻页效果实例代码,重点讲解turn.js 如何使用的。需要的朋友可以参考下2017-02-02
这篇文章主要介绍了JavaScript变量中var,let和const的区别,JavaScript中一共有3种用来声明变量的关键字，分别是var、let和const,文章通过围绕主题展开对三个关键词的详细介绍，需要的朋友可以参考一下2022-09-09
如果在使用javascript的时候涉及到event处理，就需要知道event在不同的浏览器中的差异。2009-12-12
最新评论