Question

我有一个使用@expo/vector-icons的独立的Expo项目，但是它没有在发布版本中加载矢量图标。

在调试中，矢量图标可以正确显示（请参见下图），但在发布时，它们完全不显示。我曾尝试使用expo start --no-dev --minify在本地运行以进行本地“发布”测试，但仍然无法在设备上获取任何图标。

我发现的另一个问题是Images的onLoad回调无法正常工作。为了使图像能够在Android上正确加载，我不得不在Android图像上使用以下变通办法。

if (Platform.OS === 'ios' ) {

    return (

        <View style={[style, styles.fullBackground]}>
            <Animated.Image 
                {...props}
                source={thumbnailSource}
                style={{ opacity: this.thumbnailAnimated }}
                blurRadius={2}
                onLoad={this.handleThumbnailLoad}
            />

            <Animated.Image 
                {...props}
                source={source}
                style={[styles.imageOverlay, { opacity: this.imageAnimated }, style]}
                onLoad={this.onImageLoad}
            />

        </View>

    );

} else {

    return (

        <View style={[style, styles.fullBackground]}>

            <Image 
                {...props}
                source={source}
                style={[styles.imageOverlay, { opacity: 1 }, style]}
            />

        </View>

    );

}

这是我的package.json

{
  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "eject": "expo eject",
    "postinstall": "jetify"
  },
  "dependencies": {
    "@react-native-community/datetimepicker": "2.1.0",
    "@react-native-community/slider": "^1.1.3",
    "@unimodules/core": "~5.0.0",
    "@unimodules/react-native-adapter": "~5.0.0",
    "@expo/vector-icons": "^10.0.0",
    "expo-ads-facebook": "~8.0.0",
    "expo-asset": "~8.0.0",
    "expo-facebook": "~8.0.0",
    "expo-google-app-auth": "^6.0.0",
    "expo-linear-gradient": "~8.0.0",
    "expokit": "^36.0.0",
    "geofire": "^5.0.1",
    "geofirex": "0.0.6",
    "geopoint": "^1.0.1",
    "lodash": "^4.17.11",
    "lodash.debounce": "^4.0.8",
    "moment": "^2.24.0",
    "react": "16.9.0",
    "react-native": "https://github.com/expo/react-native/archive/sdk-36.0.1.tar.gz",
    "react-native-animatable": "^1.3.2",
    "react-native-animated-linear-gradient": "^1.2.0",
    "react-native-app-intro-slider": "^2.0.1",
    "react-native-elements": "^1.1.0",
    "react-native-gesture-handler": "~1.5.0",
    "react-native-indicators": "^0.13.0",
    "react-native-iphone-x-helper": "^1.2.1",
    "react-native-linear-gradient": "^2.5.4",
    "react-native-map-link": "^2.4.5",
    "react-native-maps": "0.26.1",
    "react-native-mask-loader": "0.0.3",
    "react-native-modal": "^11.0.1",
    "react-native-reanimated": "~1.4.0",
    "react-native-share": "^1.1.3",
    "react-native-super-ellipse-mask": "^1.0.7",
    "react-native-swipeable": "^0.6.0",
    "react-native-text-gradient": "^0.1.5",
    "react-native-unified-contacts": "^2.0.0-pre.2",
    "react-navigation": "^3.11.1",
    "recyclerlistview": "^1.3.4",
    "rxjs": "^6.5.2",
    "expo-font": "~8.0.0",
    "expo": "^36.0.0"
  },
  "devDependencies": {
    "axios": "^0.19.0",
    "babel-preset-expo": "^5.0.0",
    "expo": "^36.0.0",
    "firebase": "^5.11.1",
    "firebase-admin": "^8.1.0",
    "geofirestore": "^3.3.1",
    "jetifier": "^1.6.5",
    "react-native-clean-project": "^3.2.1",
    "react-native-extra-dimensions-android": "^1.2.5",
    "react-native-firebase": "^5.2.0",
    "react-native-unimodules": "^0.5.4"
  },
  "private": true
}

我尝试了很多不同的事情，例如：

删除node_modules并重新运行npm install
从Expo SDK 35升级到Expo SDK 36
重新检查有关升级SDK的Expo文档（此项目起源于SDK 32）

为什么发生这种情况我有点茫然。甚至与来自Expo的一些人进行了交谈，他们不确定为什么会发生这种情况（尤其是Image onLoad回调）。值得注意的是，iOS版本可以在开发和发行中正常工作。

Answer 1

由于某些原因，react-native-vector-icons未链接到我的项目。因此，运行以下命令：

react-native link react-native-vector-icons

帮了我大忙。

当然，您必须事先安装了react-native-vector-icons模块，例如：

npm install react-native-vector-icons --save

世博会矢量图标不显示

1 个答案: