From 97be6d3db508deb41d625399a0a25072ca452728 Mon Sep 17 00:00:00 2001
From: luoxue <luoxue@zhuanzhuan.com>
Date: Sat, 21 Dec 2019 20:35:07 +0800
Subject: [PATCH] =?UTF-8?q?fix(react):=20=E9=87=8D=E6=96=B0=E6=8F=90?=
 =?UTF-8?q?=E4=BA=A4react?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 CHANGELOG.md                          |  1 +
 "docs/\350\257\276\346\227\266-24.md" | 47 +++++++++++++++++++++++++++
 util/createReadme.js                  |  5 ---
 3 files changed, 48 insertions(+), 5 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 565ae1b3..9a333395 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -3,6 +3,7 @@
 ### 🌟 新功能
 范围|描述|commitId
 --|--|--
+ react | 增加react并规范了目录 | [0eee296](https://github.com/luoxue-victor/learn_webpack/commit/0eee296)
  增加react配置 | [76c0fe1](https://github.com/luoxue-victor/learn_webpack/commit/76c0fe1), closes [#8](https://github.com/luoxue-victor/learn_webpack/issues/8)
  dist | 删除dist | [9600d82](https://github.com/luoxue-victor/learn_webpack/commit/9600d82)
  packages | 新加cli跟utils包 | [0828922](https://github.com/luoxue-victor/learn_webpack/commit/0828922)
diff --git "a/docs/\350\257\276\346\227\266-24.md" "b/docs/\350\257\276\346\227\266-24.md"
index ab0722ac..1f87023a 100644
--- "a/docs/\350\257\276\346\227\266-24.md"
+++ "b/docs/\350\257\276\346\227\266-24.md"
@@ -1 +1,48 @@
 ## 课时 24：配置 react
+
+基础配置已经全部配置好了，所以 react 的配置就只有将 jsx 的文件用 babel 编译一下就 ok 了，下面配置将 babel 的配置进行了修改
+
+开启 react
+
+box.config.js
+
+```js
+{
+  "env": {
+    "REACT": "react" // 配置 react
+  }
+}
+```
+
+packages/react/webpack-chain.config.js
+
+```js
+// [react 配置]
+module.exports = ({ config }) => {
+  return () => {
+    if (!process.env.REACT) return;
+    const baseRule = config.module.rule("babel");
+    baseRule
+      .use("babel")
+      .loader(require.resolve("babel-loader"))
+      .tap(options => {
+        options.presets.push([
+          "@babel/preset-react",
+          {
+            corejs: "3",
+            useBuiltIns: "usage",
+            loose: true,
+            modules: false,
+            targets: {
+              chrome: 59,
+              edge: 13,
+              firefox: 50,
+              safari: 8
+            }
+          }
+        ]);
+        return options;
+      });
+  };
+};
+```
diff --git a/util/createReadme.js b/util/createReadme.js
index 97eabc64..b791e5e0 100644
--- a/util/createReadme.js
+++ b/util/createReadme.js
@@ -18,21 +18,16 @@ const packageConfig = extraTxtFromDirWithFilename(
     return `[${firstRow.replace('// ', '')}]`
   })
 
-console.log(packageConfig)
-
 function joinCtx () {
   let str = ''
   str += readMdBy('header')
   str += detailTag('所有课题', docsCtx, false)
   str += readMdBy('useAndIntsall')
   str += detailTag('所有配置', configCtx + packageConfig)
-  // str += extraTxtFromDirWithFilename('packages', 'webpack-chain.config.js')
   str += boxConfig()
   return str
 }
 
-// console.log(extraTxtFromDirWithFilename('packages', 'webpack-chain.config.js'))
-
 const ctx = joinCtx()
 
 fs.writeFileSync('README.md', ctx, 'utf-8')