在 webpack 中，path 和 publicPath 有什么区别

Question

我的 webpack 配置文件如下所示，它将 main.js 从 ./src/ 捆绑到 ./lib/public

publicPath 到底在做什么？我可以看到只有 path 指定了 js 包将进入的文件夹？

module.exports = {
  entry: './src/js/main.js',
  output: {
    filename: 'bundle.js',
    path: './lib/public/',
    publicPath: 'public'
  },
  module: {
    loaders: [
      { test: /\.js$/, loader: 'babel-loader' }
    ]
  }
};

Answer 1

您可以使用 is 来定义资产（图像等）的位置。 IE。您甚至可以通过设置从自定义目录或 CDN 加载资产。有关详细信息，请参阅官方文档中的 output.publicPath。

Answer 2

publicPath : 您的 public 图片，css 文件保存在这里

path : js构建包保存在这个文件中

Answer 3

扩展说明

path: 是我们要放置构建文件的绝对路径，执行如下命令后：yarn build/npm run build。换句话说，就是我们选择保存文件的硬盘物理位置。

示例：output: {path: path.resolve(__dirname, 'build'}。这意味着我们可以在以下位置找到我们构建的文件：绝对路径/这行代码所在的当前路径is/build/。那是我们构建文件的物理位置。

publicPath: 是您的文件将在服务器上提供的相对路径。

示例：output: {publicPath: '/assets/js/', filename: 'main.js'}。您现在在服务器上的文件将在路径上提供：/assets/js/main.js

您可以使用 webpack-manifest-plugin 创建 manifest.json 文件，当打开它时，您可以看到 publicPath 被添加到 mainfest.json 文件中的每个值之前。

简答：

output.publicPath 是您 manfiest.json 如何引用文件的价值。 output.path 是构建文件的物理位置。

output.path: 'build/' 您构建的所有文件都将位于 build 文件夹中。

output.publicPath: 'foo/bar' 您的所有文件将通过 foo/bar 地址引用，您可以在清单中以不同方式映射。

在 webpack 中，path 和 publicPath 有什么区别

In webpack what is the difference between path and publicPath

webpack

babeljs