webpack-dev-server打包生成的 js 文件在哪?
在内存中。 由于我们每次保存页面都会导致重新打包文件,因此为了更快速的构建,webpack-dev-server 把生成的js文件放到内存中,众所周知在内存中的速度是十分快的。
插件: html-webpack-plugin
这个插件的通常用法是根据指定的index.html模板生成一个存在于内存中的index.html,它会自动引入webpack-dev-server打包出的在内存中的bundle.js文件,在我们开发的时候,可以去请求这个存在于内存中的index.html,这样可以有效的减少读取物理磁盘中内容而导致的刷新滞后。
new htmlWebpackPlugin({
template: path.resolve(__dirname, ‘index.html’),
filename: ‘index.html’
})
这里,template 指的就是模板文件所在的位置,而filename则代表生成文件的名字。
如果不进行配置的话,html-webpack-plugin默认生成的index.html的位置与我们在output中配置的是一样的。我们查看output中的path的位置在dist文件夹下,那么生成的index.html文件将会在dist文件夹中,但是我们查看不到,因为它是在内存中。