加快webpack编译，使项目热更新加快

title: 加快webpack编译，使项目热更新加快
tags: Webpack
categories: 学习笔记

---

加快webpack编译，使项目热更新加快，一点小的技巧

<The rest of contents | 余下全文>

在项目开始的时候，文件还不会很多，我们都没关心热更新的问题，到了大的时候就编译热更新坐在那里等个好久，我说的好久可能大家的都不一样，
哈哈哈；接下来，介绍一些小技巧，往后发现就会继续追更，emmm,嘻嘻

技巧一：利用babel-loader缓存参数

module.exports = {
    module: {
        noParse: /node_modules\/(jquey|moment|chart\.js)/,
        rules: [
            {
                test: /\.js$/,
                loader: 'babel-loader?cacheDirectory',
                include: [resolve('src'), resolve('test')],
                exclude:/node_modules/
            },
        ]
    }
}

项目往后需要编译的文件更多，因此我们从babel-loader下手

1. 由于项目开的时候用的是webpack2.x的版本，但是百度后3.x的这个属性依旧是可以用的，会使之前的热更新加快的其中一个点；
2. 忽略编译node_modules,使解析babel-loader再快

技巧二：忽略掉一些大的node_modules里面的模块

module.exports = {
    module: {
        //这里列出一些模块，根据自己项目去除一些编译的文件
        noParse: /node_modules\/(jquey|moment|chart\.js)/,
    }
}