React Native 快速搭建商城项目基础结构

一、init指定项目版本(如果直接使用最新版可不要后缀 --verbose --version 0.52.0)

react-native init demo --verbose --version 0.52.0

二、引入必要插件

cd demo/
npm install axios react-native-elements react-native-vector-icons react-navigation react-redux redux redux-thunk query-string prop-types react-native-device-info --save
react-native link react-native-device-info && react-native link react-native-vector-icons

三、启动(RN版本升级会出现一些莫名其妙的坑)
启动失败大概解决方案:
1.在文件根目录执行命令(注意版本)

cd node_modules/react-native/third-party/glog-0.3.4 && ../../scripts/ios-configure-glog.sh

2.Build failed 一步到位命令

rm -rf node_modules/ && npm install && cd ios/ && rm -rf build/ && cd .. && react-native run-ios

3.其他帖子里面也有相关解决办法

四、拷贝并替换代码
1.拷贝下方文件App.js替换掉本项目中该文件
2.拷贝下方文件src文件粘贴到本项目的根目录
3.reload 一下模拟器(这一步之后肯定会报错),在终端执行命令,并在此reload

rm ./node_modules/react-native/local-cli/core/__fixtures__/files/package.json

文件地址:https://download.csdn.net/download/koufulong/11978558

五、嵌入图标文件

1.在xcode中,将node_modules/react-native-vector-icons下的Fonts文件夹拖入到项目中,并确保选择Create groups


在这里插入图片描述

2.查看Info.plist 中是否有Fonts provided by application,如果没有,手动添加


在这里插入图片描述

或者在info.plist文件中加入以下代码:

UIAppFonts
    
        Entypo.ttf
        EvilIcons.ttf
        Feather.ttf
        FontAwesome.ttf
        Foundation.ttf
        Ionicons.ttf
        MaterialCommunityIcons.ttf
        MaterialIcons.ttf
        Octicons.ttf
        SimpleLineIcons.ttf
        Zocial.ttf
    

你可能感兴趣的:(React Native 快速搭建商城项目基础结构)