webpack-dev-server打包项目

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文件夹中,但是我们查看不到,因为它是在内存中。

猜你喜欢

转载自blog.csdn.net/sjs1995/article/details/106369383