From fec07025d7b1a892cc59c2c759a77300909f2af3 Mon Sep 17 00:00:00 2001
From: jaywcjlove <398188662@qq.com>
Date: Fri, 15 Jun 2018 00:52:22 +0800
Subject: [PATCH] Update README.md

---
 README.md | 54 ++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 54 insertions(+)

diff --git a/README.md b/README.md
index 7aa0867d..cdc2a911 100644
--- a/README.md
+++ b/README.md
@@ -43,6 +43,60 @@ module.exports = function (webpackConf, devServer) {
 }
 ```
 
+### Rules 配置修改
+
+修改替换其中的 `Rules`，这里有 [默认Webpack配置](./conf)，你可以根据默认配置进行替换和删除，好复杂哦。
+
+```js
+module.exports = function (webpackConf, devServer) {
+  if (webpackConf) {
+    webpackConf.module.rules.map((item) => {
+      if (item.oneOf) {
+        item = item.oneOf.map((childItem) => {
+          if (String(/\.(css|less)$/) === String(childItem.test)) {
+            childItem.use = childItem.use.map((_childItem) => {
+              if (_childItem.loader === require.resolve('css-loader')) {
+                // 这里将 css-loader 配置替换了重新配置
+                _childItem = {
+                  loader: require.resolve('css-loader'),
+                  options: {
+                    root: '.',
+                    modules: true,
+                    // minimize: true,
+                    localIdentName: '[local]',
+                    importLoaders: 1,
+                    getLocalIdent: (context, localIdentName, localName) => {
+                      // 过滤 uiw 组件库，因为 modules=true 参数，会将 className替换成Hash，导致uiw样式无法加载
+                      const hash = loaderUtils.getHashDigest(context.resourcePath + localIdentName, 'md5', 'base64', 5);
+                      const uiwpath = path.join(process.cwd(), 'node_modules', 'uiw');
+                      if ((new RegExp(`^${uiwpath}`)).test(context.resourcePath)) {
+                        return localName;
+                      }
+                      return localName + hash;
+                    },
+                  },
+                }
+              }
+              return _childItem;
+            });
+          }
+          return childItem;
+        });
+      }
+      return item;
+    });
+
+    if (webpackConf.mode === 'development') {
+      // 开发模式下更改的 webpack 配置
+    }
+    if (webpackConf.mode === 'production') {
+      // 生产模式下更改的 webpack 配置
+    }
+    return webpackConf
+  };
+}
+```
+
 ## Mock API
 
 在项目根目录添加 `.kktmock.js` 文件，再在文件中添加需要模拟的API，相关文档在这里[webpack-api-mocker](https://github.com/jaywcjlove/webpack-api-mocker)，下面来个实例：