Webpack 文档指出output.publicPath：
在
output.path与JavaScript的视图。
您能否详细说明这实际上意味着什么？
我使用output.path和output.filename来指定 Webpack 应该在何处输出结果，但我不确定要放入什么output.publicPath以及是否需要。
module.exports = {
output: {
path: path.resolve("./examples/dist"),
filename: "app.js",
publicPath: "What should I put here?"
}
}
output.path用于存储所有输出文件的本地磁盘目录（绝对路径）。
例子： path.join(__dirname, "build/")
Webpack 会将所有内容输出到 localdisk/path-to-your-project/build/
output.publicPath您上传捆绑文件的位置。（绝对路径，或相对于主 HTML 文件）
例子： /assets/
假设您在服务器 root 部署了应用程序http://server/。
通过使用/assets/，应用程序将在以下位置找到 webpack 资产：http://server/assets/。在后台，webpack 遇到的每个 url 都将被重写为以“ /assets/”开头。
src="picture.jpg"重写 ➡src="/assets/picture.jpg"访问者： (
http://server/assets/picture.jpg)
src="/img/picture.jpg"重写 ➡src="/assets/img/picture.jpg"访问者： (
http://server/assets/img/picture.jpg)
在浏览器中执行时，webpack 需要知道您将在哪里托管生成的包。因此，它能够请求额外的块（当使用代码拆分时）或分别通过file-loader或url-loader 加载的引用文件。
例如：如果您将 http 服务器配置为托管生成的包，/assets/您应该编写：publicPath: "/assets/"
publicPath 仅用于开发目的，我第一次看到这个配置属性时很困惑，但是现在我已经使用 webpack 一段时间了
假设你把你所有的JS源文件下的src文件夹，并且配置你的WebPack源文件建立到dist文件夹output.path。
但是您希望在更有意义的位置下提供静态资产，例如webroot/public/assets，这次您可以使用out.publicPath='/webroot/public/assets'，以便在您的 html 中，您可以使用<script src="/webroot/public/assets/bundle.js"></script>.
当您请求webroot/public/assets/bundle.js该webpack-dev-server会发现dist文件夹下的JS
更新：
感谢查理马丁纠正我的答案
原文：publicPath 仅用于开发目的，这不仅仅是用于开发目的
不，这个选项在开发服务器中很有用，但它的目的是在生产中异步加载脚本包。假设您有一个非常大的单页应用程序（例如 Facebook）。Facebook 不希望每次加载主页时都提供其所有 javascript，因此它只提供主页上需要的内容。然后，当您转到您的个人资料时，它会使用 ajax 为该页面加载更多 javascript。此选项告诉它从服务器上的何处加载该包
filename指定文件的名称，您的所有捆绑代码在完成构建步骤后将累积到该文件中。
路径指定输出目录，其中app.js（文件名）是会得到保存在磁盘上。如果没有输出目录，webpack 会为你创建那个目录。例如：
module.exports = {
output: {
path: path.resolve("./examples/dist"),
filename: "app.js"
}
}
这将创建一个目录myproject/examples/dist并在该目录下创建app.js，/myproject/examples/dist/app.js。构建完成后，您可以浏览到myproject/examples/dist/app.js来查看捆绑的代码
publicPath：“我应该在这里放什么？”
publicPath指定web 服务器中的虚拟目录，从那里捆绑文件 app.js 将被提供。请记住，使用 publicPath 时的服务器一词可以是 webpack-dev-server 或 express server 或其他可以与 webpack 一起使用的服务器。
例如
module.exports = {
output: {
path: path.resolve("./examples/dist"),
filename: "app.js",
publicPath: path.resolve("/public/assets/js")
}
}
此配置告诉 webpack 将所有 js 文件捆绑到examples/dist/app.js并写入该文件。
publicPath告诉 webpack-dev-server 或 express 服务器从服务器中指定的虚拟位置（即 /public/assets/js）提供这个捆绑文件，即examples/dist/app.js。因此，在您的 html 文件中，您必须将此文件引用为
<script src="public/assets/js/app.js"></script>
因此，在总结，publicPath像之间的映射virtual directory在你的服务器，并output directory通过output.path配置，只要对文件请求指定的公共/资产/ JS / app.js来，/examples/dist/app.js文件将被送达
您可以使用 publicPath 指向您希望 webpack-dev-server 为其“虚拟”文件提供服务的位置。publicPath 选项将是 webpack-dev-server 的 content-build 选项的相同位置。 webpack-dev-server创建虚拟文件，当您启动它时将使用这些文件。这些虚拟文件类似于 webpack 创建的实际捆绑文件。基本上，您会希望 --content-base 选项指向您的 index.html 所在的目录。这是一个示例设置：
//application directory structure
/app/
/build/
/build/index.html
/webpack.config.js
//webpack.config.js
var path = require("path");
module.exports = {
...
output: {
path: path.resolve(__dirname, "build"),
publicPath: "/assets/",
filename: "bundle.js"
}
};
//index.html
<!DOCTYPE>
<html>
...
<script src="assets/bundle.js"></script>
</html>
//starting a webpack-dev-server from the command line
$ webpack-dev-server --content-base build
webpack-dev-server 已经创建了一个虚拟资产文件夹以及它所引用的虚拟 bundle.js 文件。您可以通过转到 localhost:8080/assets/bundle.js 来测试它，然后在您的应用程序中检查这些文件。它们仅在您运行 webpack-dev-server 时生成。