fix: fix review & update builder-config.md

build-config.md

@@ -320,6 +320,26 @@ const apiUrl = "http://foobar.com/api" + 'test'
 
     `true` 表示开启，`false` 表示关闭，默认开启。
 
+- **`optimization.swc`**
+
+    类型：`boolean`
+
+    是否使用 `swc` 替换 `babel-loader`、`ts-loader`，开启 `swc` 时需注意以下几点：
+
+    * 如果自定义 `transforms` 的配置中包含 `babelOptions`，`swc` 将不会开启
+
+    * `swc` 不会读取项目中的 `tsconfig.json` 配置，`fec-builder` 会将 `tsconfig.json` [部分的 `compilerOptions` 配置](https://github.com/Front-End-Engineering-Cloud/builder/pull/167/commits/1679c2ba46c7c2e5babdd9fb29c1202dce8a6da9#diff-83d272b0300573209dc5e33e57e9ac300c837e0327f36ea67cef9a685a06becbR25) 转换后传给 `swc`
+
+    * `swc` 不支持 `ts` 的类型检查，导致 `transpileOnlyWhenDev` 开关无效，如果需要在打包中校验类型可在打包构建步骤中加入 `tsc --noEmit` 来做类型检查
+
+    * `swc` 不支持使用项目中 `typescript` 进行编译，导致 `useProjectTypeScript` 开关无效
+
+    * `swc` 不支持 `JSX` 中的 `spread operator` 语法
+
+    * `browserslist` 在 `swc` 中的行为相较 `babel` 有所差异，以配置的 `extends @qiniu/build-config/portal` 为例，使用 `swc` 后 `bundle` 中会包含 `let` `const` `async` `await` `箭头函数` 语法
+
+    `true` 表示开启，`false` 表示关闭，默认关闭。
+
 ## **`devProxy`**
 
 类型：`object`

preset-configs/config.schema.json

@@ -166,6 +166,10 @@
         "errorOverlay": {
           "type": "boolean",
           "description": "是否开启 `react-refresh-webpack-plugin` 的错误提示。 \n`true` 表示开启，`false` 表示关闭，默认开启。"
+        },
+        "swc": {
+          "type": "boolean",
+          "description": "是否使用 `swc` 替换 `babel-loader`、`ts-loader`，开启 `swc` 时需注意以下几点：\n* 如果自定义 `transforms` 的配置中包含 `babelOptions`，`swc` 将不会开启\n* `swc` 不会读取项目中的 `tsconfig.json` 配置，`fec-builder` 会将 `tsconfig.json` [部分的 `compilerOptions` 配置](https://github.com/Front-End-Engineering-Cloud/builder/pull/167/commits/1679c2ba46c7c2e5babdd9fb29c1202dce8a6da9#diff-83d272b0300573209dc5e33e57e9ac300c837e0327f36ea67cef9a685a06becbR25) 转换后传给 `swc`\n* `swc` 不支持 `ts` 的类型检查，导致 `transpileOnlyWhenDev` 开关无效，如果需要在打包中校验类型可在打包构建步骤中加入 `tsc --noEmit` 来做类型检查\n* `swc` 不支持使用项目中 `typescript` 进行编译，导致 `useProjectTypeScript` 开关无效\n* `swc` 不支持 `JSX` 中的 `spread operator` 语法\n* `browserslist` 在 `swc` 中的行为相较 `babel` 有所差异，以配置的 `extends @qiniu/build-config/portal` 为例，使用 `swc` 后 `bundle` 中会包含 `let` `const` `async` `await` `箭头函数` 语法\n`true` 表示开启，`false` 表示关闭，默认关闭。"
         }
       }
     },

src/webpack/swc.ts

@@ -2,13 +2,13 @@ import fs from 'fs'
 import browserslist from 'browserslist'
 import { Options as SwcOptions } from '@swc/core'
 import { CompilerOptions } from 'typescript'
-import { merge } from 'lodash'
+import { mergeWith } from 'lodash'
 
 import { shouldAddGlobalPolyfill, AddPolyfill } from '../utils/build-conf'
 import { abs } from '../utils/paths'
 
-/** read and parse tsconfig.json */
-function readTsConfig() {
+/** 读取 tsconfig.json 文件获取 compilerOptions 配置 */
+function getTsCompilerOptions() {
   const filePath = abs('tsconfig.json')
 
   if (fs.existsSync(filePath)) {
@@ -22,7 +22,7 @@ function readTsConfig() {
 
 /** swc 不会读取 tsconfig.json 的配置，这里手动转成 swc 的配置 */
 /** 参考自 https://github.com/Songkeys/tsconfig-to-swcconfig/blob/62e7f585882443bd27beb5b2e05a680f18070198/src/index.ts */
-function convertTsConfig(options: CompilerOptions): SwcOptions {
+function transformTsCompilerOptions(options: CompilerOptions): SwcOptions {
   const {
     importHelpers = false,
     experimentalDecorators = false,
@@ -96,10 +96,14 @@ export function makeSwcLoaderOptions(
   }
 
   if (isTsSyntax) {
-    const compilerOptions = readTsConfig()
+    const compilerOptions = getTsCompilerOptions()
 
     if (compilerOptions != null) {
-      return merge(swcOptions, convertTsConfig(compilerOptions))
+      return mergeWith(swcOptions, transformTsCompilerOptions(compilerOptions), (_srcValue, targetValue) => {
+        if (Array.isArray(targetValue)) {
+          return targetValue
+        }
+      })
     }
   }