react-native项目创建

2018-07-09  本文已影响0人  wuruiliang

首先安装npm和node.js并将npm源改为淘宝的源。

安装好npm之后,一种创建项目方式是使用npm install -g react-native-cli命令安装react-native-cli,然后使用react-native init MyApp创建名为MyApp的项目。但在0.56版本中这种创建方法会报如下错误:

SyntaxError: Unexpected token import
    at createScript (vm.js:80:10)
    at Object.runInThisContext (vm.js:139:10)
    at Module._compile (module.js:616:28)
    at Module._compile (D:\AndroidStudioWorkspace\MyApp\node_modules\pirates\lib\index.js:91:24)
    at Module._extensions..js (module.js:663:10)
    at Object.newLoader [as .js] (D:\AndroidStudioWorkspace\MyApp\node_modules\pirates\lib\index.js:96:7)
    at Module.load (module.js:565:32)
    at tryModuleLoad (module.js:505:12)
    at Function.Module._load (module.js:497:3)
    at Module.require (module.js:596:17)

官方推荐的另一种创建方法是使用create-react-native-app。

首先使用命令npm install -g create-react-native-app安装create-react-native-app,然后使用命令create-react-native-app MyApp创建名为MyApp的项目,cd MyApp进入项目路径后使用命令npm start启动开发服务端。
至此一个react-native项目创建完成。

启动服务后,官方推荐使用expo这个app来实时查看项目效果,因此需先下载expo或电脑通过数据线连接到手机后在服务端输入a安装expo。这里有一个问题即运行时报找不到路径的错误如下图:


react-native项目创建

原因是expo适配器默认选择的是以太网适配器,而手机设备和电脑设备都是无线局域网连接,应该使用的是无线局域网IP。解决方法就是在expo的explore页面手输无线局域网适配器IP加端口号打开项目。

到这里一个可以运行的react-native项目创建完成,可以修改App.js文件里的内容查看运行效果。

如果不想只是在expo中运行程序并且想要实现更多的功能,那么还是采用react-native init的方式创建。只不过在命令后加--version 0.55.0来指定使用0.55的版本就可以避免之前的错误。然后进入项目目录使用react-native run-android启动服务端并构建安卓程序。

上一篇下一篇

猜你喜欢

热点阅读