@ expo /ベクトルアイコンがサブフォルダから実行されているときにロードされていません

Question

私はをexporeと共にmonorepo設定で使用しようとしています。サブフォルダapp/からアプリケーションを起動し、@expo/vector-iconsをインポートすると、フォントファミリが見つからないというエラーが表示されます。

"fontFamily" 'material' is not a system font and has not been loaded 
through Expo.Font.loadAsync. 

私はアイコンが細かいロードメインsrc/フォルダ内のアプリを起動した場合。

rn-cli.config.jsを設定して、他の依存関係のためにアプリケーションをコンパイルして正常に実行できるようにしました。私のプロジェクトはmonorepoのようにセットアップされているので、私はレポに複数のネイティブアプリを持つことができます。

src/ 
    MainApp.js 
    package.json 
    app/App.js 
    app/app.json 
    app/package.json 
    app/rn-cli.config.js 
    ... 

私は無駄にカップルの事を試してみた：

• app.jsonファイルに"assetExts": ["ttf"]を設定するサブフォルダpackage.jsonで@expo/vector-icons
• をインストールします。 （主に新鮮creat-react-native-appから）

マイコード：

APP/App.js

export { default } from "../MainApp"; 

APP/app.json

{ 
    "expo": { 
    "sdkVersion": "22.0.0", 
    "react": "16.0.0-beta.5" 
    } 
} 

APP/package.json

{ 
    "private": true, 
    "main": "./node_modules/react-native-scripts/build/bin/crna-entry.js", 
    "scripts": { 
    "native": "react-native-scripts start" 
    }, 
    "dependencies": { 
    "@expo/vector-icons": "^6.2.1", 
    "expo": "^22.0.0", 
    "react-native": "^0.49.0", 
    "react-native-scripts": "1.7.0" 
    } 
} 

アプリ/ RN-cli.config.js

{ 
    "name": "react-native-app", 
    "version": "0.1.0", 
    "private": true, 
    "devDependencies": { 
    "react-native-scripts": "1.7.0" 
    }, 
    "scripts": { 
    "native": "cd app && yarn native" 
    }, 
    "dependencies": { 
    "@expo/vector-icons": "^6.2.1", 
    "expo": "^22.0.0", 
    "react": "16.0.0-beta.5", 
    "react-native": "^0.49.0" 
    } 
} 

MainApp.js

import React from "react"; 
import { StyleSheet, Text, View } from "react-native"; 
import MaterialIcons from "react-native-vector-icons/MaterialIcons"; 

export default class App extends React.Component { 
    render() { 
    return (
     <View style={styles.container}> 
     <Text>Open up App.js to start working on your app!</Text> 
     <Text>Changes you make will automatically reload.</Text> 
     <Text>Shake your phone to open the developer menu.</Text> 
     <MaterialIcons name="search" color="black" size={32} /> 
     <MaterialIcons name="location-searching" color="black" size={32} /> 
     </View> 
    ); 
    } 
} 
const styles = StyleSheet.create({ 
    container: { 
    flex: 1, 
    backgroundColor: "#fff", 
    alignItems: "center", 
    justifyContent: "center" 
    } 
}); 

Answer 1

私は2つの異なるエクスポモジュールを持っていたようだった。サブフォルダにあるものを取り除くことで、それが機能しました。

Answer 2

私が反応し、ネイティブのためにかなり新しいですが、私が持っていた

const blacklist = require("metro-bundler/src/blacklist"); 
const path = require("path"); 

const roots = [process.cwd(), path.resolve(__dirname, "..")]; 

const config = { 
    getProjectRoots:() => roots, 

    /** 
    * Specify where to look for assets that are referenced using 
    * `image!<image_name>`. Asset directories for images referenced using 
    * `./<image.extension>` don't require any entry in here. 
    */ 
    getAssetRoots:() => roots, 

    /** 
    * Returns a regular expression for modules that should be ignored by the 
    * packager on a given platform. 
    */ 
    getBlacklistRE:() => 
    blacklist([ 
     // Ignore the local react-native so that we avoid duplicate modules 
     /\/app\/node_modules\/react-native\/.*/ 
    ]) 
}; 

module.exports = config; 

package.json同様の問題は、私は万博のアイコンをインストールしないで解決し、それらを正常に使用しています。だから私のpackage.jsonに私が

"react-native-vector-icons": "^4.4.2", 

を持っていると私は次のようにフォントをインポートします。私は、これは完璧なソリューションではありません賭けるが、博覧会は、物事を容易にするためだけのツールであるとして、Iドン

import Icon from 'react-native-vector-icons/FontAwesome'; 

）他のツールを使うのではなく、何かをすることが悪いと感じている）