webpack-dev-server与html-webpack-plugin插件的注意点

webpack-dev-server插件会自动监听程序员保存操作。

注意点:   该插件会把打包生成文件存储在内存中,所以在使用的时候需要引入这个文件而不是物理磁盘上的。

  <script src=" http://localhost:8080/bundle.js"></script>

 为什么要把生成的文件存在内存中呢?

原因:避免多次对磁盘进行操作,避免减少磁盘寿命。而且访问速度快

可以在webpack-config.js中通过devServer节点,对webpack-dev-server进行更多配置

module.export={
    devServer:{
            //首次打包成功 打开浏览器
            open:true,
            //修改端口号
            port:3000,
            //修改localhost为127.0.0.1
            host:'127.0.0.1'
})

 

 

html-webpack-plugin插件的功能:a.可以复制html的页面内容 b.在复制出的页面还会自动加上生成的js

 

posted @ 2021-08-18 09:22  冰镇汽水  阅读(129)  评论(0编辑  收藏  举报