3

我正在尝试使用在 android 和 web 上同时运行的 react native 创建一个混合应用程序。因此尝试使用 react-native-vector-icons 包,但是当我尝试运行时,android 版本正在编译而没有任何错误,尽管网络版本引发以下错误:

./node_modules/react-native-vector-icons/lib/create-icon-set.js
SyntaxError: D:\Parentlane\ReactNativeWeb\node_modules\react-native-vector-icons\lib\create-icon-set.js: Support for the experimental syntax 'classProperties' isn't currently enabled (43:10):

  41 | 
  42 |   class Icon extends PureComponent {
> 43 |     root = null;
     |          ^
  44 | 
  45 |     static propTypes = {
  46 |       allowFontScaling: PropTypes.bool,

Add @babel/plugin-proposal-class-properties (https://git.io/vb4SL) to the 'plugins' section of your Babel config to enable transformation.

下面是我的 package.json:

{
  "name": "ReactNativeWeb",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "android": "react-native run-android",
    "ios": "react-native run-ios",
    "web": "react-scripts start",
    "start": "react-native start",
    "test": "jest",
    "lint": "eslint ."
  },
  "dependencies": {
    "babel-loader": "^8.1.0",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-react": "^6.24.1",
    "react": "16.13.1",
    "react-dom": "^16.13.1",
    "react-native": "0.63.2",
    "react-native-vector-icons": "^7.1.0",
    "react-native-web": "^0.13.12"
  },
 
  "devDependencies": {
    "@babel/core": "^7.11.6",
    "@babel/plugin-proposal-class-properties": "^7.10.4",
    "@babel/preset-env": "^7.11.5",
    "@babel/preset-react": "^7.10.4",
    "@babel/runtime": "^7.11.2",
    "@react-native-community/eslint-config": "^2.0.0",
    "metro-react-native-babel-preset": "^0.63.0",
    "react-scripts": "^3.4.3",
    "react-test-renderer": "16.13.1",
    "webpack-cli": "^3.3.12",
    "webpack-dev-server": "^3.11.0"
  },
  "jest": {
    "preset": "react-native"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

babel.config.js:

module.exports = {
  presets: ['module:metro-react-native-babel-preset'],
};

谁能告诉我如何解决这个错误?

4

0 回答 0