Please provide the following:
- SDK Version: 37.0.0
- Platforms(Android/iOS/web/all): Android/iOS
I am develop the app that using @expo/vector icon. In local, the icons display correct but after publishing to expo server the icons display wrong (chinese words, x, …)
Local:
Published:
I used app loading and load cache resource async
export default class App extends React.Component {
constructor(props) {
super(props);
this.state = {
isAppReady: false,
};
}
cacheResourcesAsync = async () => {
const imageAssets = cacheImages([
require("./assets/Splash.png"),
require("./assets/Logo.png"),
require("./assets/Logo_128.png"),
require("./assets/Logo_256.png"),
require("./assets/Logo_512.png"),
require("./assets/Logo_512_White.png"),
]);
await Font.loadAsync(MaterialCommunityIcons.font);
const fontAssets = cacheFonts([MaterialCommunityIcons.font]);
return Promise.all([
...imageAssets,
...fontAssets,
new ExpoNotification().loadExpoToken(),
authAction.loadAccessToken(),
]);
};
render() {
if (!this.state.isAppReady) {
const coponentProps = {
...(__DEV__ && { onError: console.warn }),
};
return (
<AppLoading
{...coponentProps}
startAsync={this.cacheResourcesAsync}
onFinish={() => this.setState({ isAppReady: true })}
autoHideSplash
/>
);
}
return (
<ReduxProvider store={store}>
<PaperProvider theme={theme}>
<ConnectedApp />
</PaperProvider>
</ReduxProvider>
);
}
}
My package.js"@ptomasroos/react-native-multi-slider": “^2.2.0”,
“@react-native-community/masked-view”: “0.1.6”,
“@react-navigation/bottom-tabs”: “^5.2.7”,
“@react-navigation/material-top-tabs”: “^5.1.9”,
“@react-navigation/native”: “^5.1.6”,
“@react-navigation/stack”: “^5.2.1”,
“axios”: “^0.19.2”,
“color”: “^3.1.2”,
“credit-card-type”: “^8.3.0”,
“expo”: “^37.0.0”,
“expo-asset”: “~8.1.4”,
“expo-blur”: “~8.1.0”,
“expo-font”: “~8.1.0”,
“lodash”: “^4.17.15”,
“moment”: “^2.24.0”,
“moment-range”: “^4.0.2”,
“prop-types”: “^15.7.2”,
“react”: “16.9.0”,
“react-dom”: “16.9.0”,
“react-native”: “0.61.4”,
“react-native-calendars”: “^1.265.0”,
“react-native-dash”: “^0.0.11”,
“react-native-datepicker”: “^1.7.2”,
“react-native-device-info”: “^5.5.3”,
“react-native-easy-grid”: “^0.2.2”,
“react-native-gesture-handler”: “~1.6.0”,
“react-native-input-spinner”: “^1.2.10”,
“react-native-maps”: “0.26.1”,
“react-native-masked-text”: “^1.13.0”,
“react-native-paper”: “^3.8.0”,
“react-native-reanimated”: “~1.7.0”,
“react-native-safe-area-context”: “0.7.3”,
“react-native-screens”: “~2.2.0”,
“react-native-snap-carousel”: “^3.9.0”,
“react-native-svg”: “11.0.1”,
“react-native-svg-animated-linear-gradient”: “^0.3.4”,
“react-native-tab-view”: “^2.14.0”,
“react-native-timeline-flatlist”: “^0.7.2”,
“react-native-unimodules”: “~0.8.1”,
“react-native-web”: “^0.11.7”,
“react-native-webview”: “8.1.1”,
“react-redux”: “^7.2.0”,
“reanimated-bottom-sheet”: “^1.0.0-alpha.19”,
“redux”: “^4.0.5”,
“redux-form”: “^8.3.5”,
“redux-persist”: “^6.0.0”,
“redux-thunk”: “^2.3.0”,
“reselect”: “^4.0.0”,
“validate.js”: “^0.13.1”
My babel config
module.exports = function (api) {
api.cache(true);
return {
presets: ["babel-preset-expo"],
plugins: ["@babel/plugin-transform-flow-strip-types"],
env: {
production: {
plugins: ["react-native-paper/babel", "transform-remove-console"],
},
},
};
};
My metro config (for support svg)
module.exports = function (api) {
api.cache(true);
return {
presets: ["babel-preset-expo"],
plugins: ["@babel/plugin-transform-flow-strip-types"],
env: {
production: {
plugins: ["react-native-paper/babel", "transform-remove-console"],
},
},
};
};
My app config: (in expo default) and i add some packager opts “packagerOpts”: {
"config": "metro.config.js",
"assetExts": ["bmp", "gif", "jpg", "jpeg", "png", "psd", "svg", "webp", "otf", "ttf"],
"sourceExts": [
"expo.ts",
"expo.tsx",
"expo.js",
"expo.jsx",
"ts",
"tsx",
"js",
"jsx",
"json",
"wasm",
"svg"
]
}
}
Please someone help me to take a look 