本文的路径配置主要涉及到webpack.config.js文件中devServer与output两个选项的配置
webpack-dev-server定义
webpack-dev-server主要是启动了一个使用express的Http服务器。它的作用主要是用来伺服资源文件。此外这个Http服务器和client使用了websocket通讯协议，原始文件作出改动后，webpack-dev-server会实时的编译，但是最后的编译的文件并没有输出到目标文件夹，即output中的配置:
output: { path: './dist/js', filename: 'bundle.js' }
注意：你启动webpack-dev-server后，你在目标文件夹中是看不到编译后的文件的,实时编译后的文件都保存到了内存当中。因此很多同学使用webpack-dev-server进行开发的时候都看不到编译后的文件
配置实践
前提：
1.项目的目录结构如下：
app
|__content
| |__index.html
|__src
| |__index.js
|__node_modules
|__package.json
|__webpack.config.js
2.package.json添加start命令,配置完成后运行npm start命令，打开浏览器访问http://127.0.0.1:8080/
"scripts": { "start": "webpack-dev-server" },
配置一：
webpack.config.js配置
//应用程序的起点入口。这个起点开始，应用程序启动执行
entry: './index.js', output: { filename: 'bundle.js', }, devServer: { inline: true, contentBase: './content', },
index.html内容：注意script src的值
<!doctype html public "storage"> <html> <meta charset=utf-8/> <title>My First React Router App</title> <div id=app></div> <script src="bundle.js"></script>
结论一：contentBase告诉服务器从哪个目录提供内容，只有在加载静态文件时才需要。上面index.html在项目的content文件夹下，所以contentBase值为'./content'。
配置二：
webpack.config.js
entry: './index.js', output: { filename: 'bundle.js', path: path.resolve(__dirname, 'dist'), publicPath: '/asset/', }, devServer: { inline: true, contentBase: './content', },
html配置
<!doctype html public "storage"> <html> <meta charset=utf-8/> <title>My First React Router App</title> <div id=app></div> <script src="asset/bundle.js"></script>
运行结果：项目根目录没有生成dist文件夹，浏览器中正常显示‘Hello, React Router ’
结论二：output中的path是生成目标文件的绝对路径，但是目标文件路径中是看不到编译后的文件，因为webpack-dev-server实时编译的文件都保存到了内存中
结论三：output中的publicPath是访问output生成的文件的路径（是一个访问路径，不需要对应真实的文件路径），所以在html中需要将src设置为'asset/bundle.js'
配置三：
webpack.config.js
entry: './index.js', output: { filename: 'bundle.js', path: path.resolve(__dirname, 'dist'), publicPath: '/asset/', }, devServer: { inline: true, contentBase: './content', publicPath: '/new/asset/', },
html配置
<!doctype html public "storage"> <html> <meta charset=utf-8/> <title>My First React Router App</title> <div id=app></div> <script src="new/asset/bundle.js"></script>
结论四：devServer中的publicPath配置会覆盖output中的publicPath配置
文档