记录Webpack publicPath使用的困惑

最新推荐文章于 2023-10-18 13:12:35 发布

u010690694

最新推荐文章于 2023-10-18 13:12:35 发布

阅读量724

点赞数

分类专栏： webpack打包文章标签： npm node.js javascript

本文链接：https://blog.csdn.net/u010690694/article/details/109602808

版权

webpack打包中publicPath的采坑

在使用webpack打包过程中有多处使用publicPath导致理解出现误差，特写此文章已做记录。

publicPath是一个在很多的loader中都有的一个配置，它是一个静态文件的发布目录，在output中可以进行默认的publicPath设置，也可以在对应的loader中分别设置。
output中设置的对应为webpack_public_path这个内置变量。
常用的设置：
1.在“file-loader"中的publicPath，为你的文件配置自定义 public 发布目录,默认值为output.publicPath。
以常用图片为例：
不设置“file-loader"中publicPath则文件打包后的路径为output.publicPath+fileLoader.outputPath+name.ext设置后图片路径为fileLoader.publicPath+name.ext详细file-loader的使用可点击查看

 {
                test: /\.(png|svg|jpg|gif)$/,
                use: [
                    // 'file-loader'
                    {
                        loader: 'file-loader',
                        options: {
                            name: