javascript - React - 模块解析失败 : Unexpected token

Question

我决定安装 npm 包 react-radio-buttons安装并应用我的组件后出现错误:

./node_modules/react-radio-buttons/index.jsx 80:6
module parse failed: Unexpected token (80:6)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
|     const style = horizontal ? { display: 'inline-flex', width: '100%' } : {};
|     return (
>       <div style={style} { ...props}>
|         {
|           children.map((c, i) => this.renderChild(c, i, i === checkedIndex)))

我想这个问题可能与 package.json 有关，但我不知道如何解决这个问题。在我提供包文件之前，我想警告 dependencies 对象中的很多属性，我会把所有东西都剪掉，只留下 "react-radio-buttons": "^ 1.2. 2", 实际发生错误的包。

package.json

{
  "name": "my-app",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "react-radio-buttons": "^1.2.2",
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

Answer 1

在我的例子中，错误是由不正确的使用引起的 => import { RadioGroup } from "react-radio-buttons/index"; (/index 应该被删除)

解决方案是将其更改为:

import { RadioGroup } from "react-radio-buttons";