reactjs - react-native-web:编译失败(react-native-vector-icons)

Question

构建react-native-web时出现如下错误:

ERROR in ./node_modules/react-native-vector-icons/lib/create-icon-set.js 43:21
Module parse failed: Unexpected token (43:21)
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
| 
|   class Icon extends PureComponent {
>     static propTypes = {
|       allowFontScaling: PropTypes.bool,
|       name: IconNamePropType,
 @ ./node_modules/react-native-vector-icons/AntDesign.js 6:0-50 9:16-29
 @ ./src/containers/news/index.js
 @ ./src/App.js
 @ ./src/index.js

我在 .babelrc 文件下有这个部分

{
  "presets": [
    "@babel/preset-env",
    "@babel/preset-react",
    "@babel/preset-typescript",
    "module:metro-react-native-babel-preset"
  ],
  "plugins": [
    ["module-resolver", {
      "alias": {
        "^react-native$": "react-native-web"
      }
    }],
    "@babel/plugin-transform-runtime",
    ["@babel/plugin-proposal-class-properties", { "loose": true }]
  ]
}

有人能帮忙吗？

Answer 1

将 .babelrc 配置移动到 webconfig 对我有用，webconfig 看起来像这样

rules: [
  {
    test: /\.(js|jsx)$/,
    loader: 'babel-loader',
    options: {
      presets: [
        '@babel/preset-env',
        "@babel/preset-react",
        {
          plugins: [
            '@babel/plugin-proposal-class-properties'
          ]
        }
      ]
    },
  },
  {
    test: /\.css$/,
    loader: 'style-loader!css-loader'
  }
]