Webpack从入门到出门(7)

(如转载, 请注明出处)

1.如何使页面自动刷新, 有点类似热重载,但更智能:

首先在webpack.config.js中引入webpack依赖: var webpack = require('webpack');

然后:


在devServer中添加hot: true字段


将ExtractTextPlugin中的disable字段改为true


在plugins中添加两个插件:webpack.HotModuleReplacementPlugin和webpack.NamedModulesPlugin


更改此处为下图



我们现在可以将app.js中的 var css = require('./app.scss');改为 import css from './app.scss';

这时我们运行后再更改代码时会看到窗口会自动刷新了.


那么如何动态配置自动刷新呢? 接下来我们需要重新配置:

1. package.json中的javascript下的prod:


2. webpack.config.js中:




最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 版权声明:本文为博主原创文章,未经博主允许不得转载。 webpack介绍和使用 一、webpack介绍 1、由来 ...
    it筱竹阅读 13,849评论 0 21
  • 无意中看到zhangwnag大佬分享的webpack教程感觉受益匪浅,特此分享以备自己日后查看,也希望更多的人看到...
    小小字符阅读 12,543评论 7 35
  • GitChat技术杂谈 前言 本文较长,为了节省你的阅读时间,在文前列写作思路如下: 什么是 webpack,它要...
    萧玄辞阅读 14,334评论 7 110
  • 学习流程 参考文档:入门Webpack,看这篇就够了Webpack for React 一. 简单使用webpac...
    Jason_Zeng阅读 8,338评论 2 16
  • 我的家乡是 山东,虽然比不上北京、上海、深圳那么华丽。但我爱我的家乡,家乡有许许多多的小房子,后来变成了高楼大厦。...
    调皮的小孩阅读 2,967评论 0 0