【Q095】publicPath 是干什么的

[kangyana]

1. output. publicPath

output.publicPath 用于指定 按需加载 或 加载外部资源 的目录。 如果指定了一个错误的值，则在加载这些资源时会收到 404 错误。

该选项的值是以 runtime 或 loader 所创建的每个 URL 为前缀。 因此，在多数情况下，此选项的值都会以 / 结束。

根据不同需求，选择其中一项配置：

// webpack.config.js

module.exports = {
  output: {
    publicPath: 'auto', // 按照以下顺序取：`import.meta.url`、`document.currentScript`、`<script />`、`self.location`
    publicPath: 'https://cdn.example.com/assets/', // CDN（HTTPS）
    publicPath: '//cdn.example.com/assets/', // CDN
    publicPath: '/assets/', // 相对于服务
    publicPath: 'assets/', // 相对于 HTML 页面
    publicPath: '../assets/', // 相对于 HTML 页面
    publicPath: '', // 相对于 HTML 页面
  },
};

在 编译时 无法知道输出文件的 publicPath 的情况下，可以留空， 然后在 入口文件 处使用自由变量 __webpack_public_path__，以便在 运行时 进行动态设置。

__webpack_public_path__ = myRuntimePublicPath;

// ...入口文件的其他代码