Yarn 构建失败 - （babel 插件）错误：[BABEL]：找不到模块 '../buildMatchMemberExpression'

Question

我的仓库中有一个模块

packages

，我在其中创建了一个新包，如下所示：

import React, { ReactElement, ReactNode } from 'react'
import styles from '../form-input/index.module.css'
import classNames from 'classnames'

interface Props extends React.HTMLProps<HTMLTextAreaElement> {
  help?: string
  icon?: ReactNode
  onClear?: () => void
}

export function FormTextarea(props: Props): ReactElement {
  const { help, icon, onClear, ...rest } = props

  return <textarea {...rest} className={classNames(styles.input, props.className)} />
}

当我尝试通过运行

packages

来构建

yarn build

模块时，出现错误：

rpt2: options error TS5052: Option 'jsxFragmentFactory' cannot be specified without specifying option 'jsxFactory'.
(babel plugin) Error: [BABEL]: Cannot find module '../buildMatchMemberExpression'

这是模块的package.json：

{
  "name": "@mypackage/ui-components",
  "private": true,
  "version": "1.0.0",
  "sideEffects": false,
  "source": "src/index.ts",
  "main": "dist/index.js",
  "module": "dist/index.esm.js",
  "types": "dist/index.d.ts",
  "scripts": {
    "build": "rimraf --no-glob ./dist && microbundle --tsconfig ./tsconfig.build.json --css-modules true  -f cjs,es --no-compress",
    "build-master": "yarn build",
    "lint": "run-p lint:*",
    "typescript": "tsc",
    "lint:eslint": "eslint --max-warnings 0 src",
    "lint:prettier": "prettier --check src",
    "format": "prettier --write src",
    "ladle:start": "yarn ladle serve",
    "ladle:build": "yarn ladle build --base /my-frontend",
    "ladle:deploy": "yarn ladle:build && gh-pages -d build",
    "clean": "rimraf ./dist"
  },
  "dependencies": {
    "@headlessui/react": "^1.6.4",
    "@popperjs/core": "^2.11.6",
    "classnames": "^2.3.1",
    "date-fns": "^2.28.0",
    "react": "^17.0.2",
    "react-day-picker": "^8.0.6",
    "react-dom": "^17.0.2",
    "react-popper": "^2.3.0"
  },
  "devDependencies": {
    "@babel/core": "^7.16.0",
    "@babel/plugin-proposal-class-properties": "^7.16.0",
    "@babel/plugin-proposal-object-rest-spread": "^7.17.3",
    "@babel/plugin-syntax-dynamic-import": "^7.8.3",
    "@babel/plugin-transform-react-jsx-source": "^7.18.6",
    "@babel/preset-env": "^7.16.11",
    "@babel/preset-react": "^7.16.0",
    "@fortawesome/fontawesome-svg-core": "6.1.2",
    "@fortawesome/free-regular-svg-icons": "6.1.2",
    "@fortawesome/free-solid-svg-icons": "6.1.2",
    "@fortawesome/pro-regular-svg-icons": "6.1.2",
    "@fortawesome/pro-solid-svg-icons": "6.1.2",
    "@fortawesome/react-fontawesome": "0.2.0",
    "@glow/eslint-config": "*",
    "@ladle/react": "^2.1.2",
    "@types/react": "^17.0.17",
    "@types/react-dom": "^17.0.17",
    "@types/tailwindcss": "^3.0.4",
    "@typescript-eslint/eslint-plugin": "^5.33.0",
    "@typescript-eslint/parser": "^5.32.0",
    "babel-plugin-dynamic-import-node": "^2.3.3",
    "classnames": "^2.3.1",
    "eslint": "^8.21.0",
    "eslint-import-resolver-typescript": "^3.4.0",
    "eslint-plugin-import": "^2.26.0",
    "eslint-plugin-jest": "^26.7.0",
    "eslint-plugin-react": "^7.29.3",
    "eslint-plugin-react-hooks": "^4.3.0",
    "gh-pages": "^4.0.0",
    "microbundle": "0.15.0",
    "postcss": "^8.4.11",
    "tailwind-styled-components": "2.1.7",
    "tailwindcss": "^3.0.24",
    "tslib": "^2.3.1",
    "typescript": "^4.7.4",
    "typescript-plugin-css-modules": "^3.4.0"
  }
}

我不确定为什么会出现此错误？ 我尝试运行

yarn nuke

和

yarn install

，但再次运行

yarn build

时出现相同的错误。

Answer 1

您是否尝试过将

jsxFactory

上的

'h'

设置为

compilerOptions

？

来自 TypeScript 官方docs：

JSX Factory 更改使用经典 JSX 运行时编译 JSX Elements 时在

.js

文件中调用的函数。

{
  "compilerOptions": {
    "target": "esnext",
    "module": "commonjs",
    "jsx": "react",
    "jsxFactory": "h",
    "jsxFragmentFactory": "Fragment"
  }
}