如何在React Native Web版本中使用react-native-vector-icons?

问题描述

我正在尝试使用可同时在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'],};

有人可以告诉我如何解决错误吗?

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)