@linux1s1s
2017-03-10T18:17:54.000000Z
字数 1997
阅读 2149
React-Native
2017-03
RN 第三方库的查询网址:JS.coach
如何将我们感兴趣的第三方库引入项目呢?
React Native 引用第三方组件 这篇博文,讲的很详细,并且验证过没有问题,所以为了方便参考,这里全部搬过来,特此说明。
npm install rnpm -g
(注意:rnpm需要node4.1或更高版本。)npm install react-native-device-info --save
rnpm link
react-native run-ios
或者react-native run-android
运行项目不明白的地方可以参考React Native 引用第三方组件
如何删除第三方库呢?
我们将上面新加的第三方库删除作为实验。
在删除之前,我们看看项目根目录下的两个与第三方库相关的文件
可以看到:
package.json声明了`react-native-device-info`依赖;
node_modules文件夹含有`react-native-device-info`依赖包
接下来我们开始删除这个依赖
npm uninstall react-native-device-info
接下来我们看看上面提及的依赖和依赖包是否还在?
经验证:
所以我们得出结论:
npm uninstall
仅仅删除了依赖包,而并没有修改依赖。
npm uninstall -s -D -O react-native-device-info
上面的命令行不靠谱,我们保险起见加了几个参数
如果是组件作为devDependencies,需要加上-D,
如果是从optionalDependencies中删除,还需要加上-O的参数,接着我们继续验证,还是和上面同样的问题,依然没有删除依赖。
既然两种方法都没有删除依赖,那是不是意味着不用删除依赖也无妨呢?
为了验证这个问题,我们编译一下项目即可。
结果果然让我们失望了,编译不通过,然后我们来找找原因。
删除compile project(':react-native-device-info')
依赖,因为这个时候依赖包已经删除了,找不到依赖,当然会报错了。
继续检查是否有相应的包引入
package com.awesomeproject;
import com.facebook.react.ReactActivity;
import com.learnium.RNDeviceInfo.RNDeviceInfo;
public class MainActivity extends ReactActivity {
/**
* Returns the name of the main component registered from JavaScript.
* This is used to schedule rendering of the component.
*/
@Override
protected String getMainComponentName() {
return "AwesomeProject";
}
}
删除import com.learnium.RNDeviceInfo.RNDeviceInfo;
即可。
以上步骤完成以后再次验证编译是否成功。
不出意外的话,编译通过,如果编译不过,需要继续删除引用到第三库的相关代码即可。
看描述是解决了传统RNListView的内存问题,来个直观图对比一下:
RNListView
SGListView
以下的框架能够极大的精简开发,基本框架可以快速生成。
- GeekyAnts/NativeBase
- react-native-elements