[绍棠] React Native开发错误警告处理总结

1.自己创建的工程


在终端直接使用:react-native init项目名称。



[plain]  view plain  copy
  1. localhost:Desktop niu$ react-native init NiuReact  
  2. This will walk you through creating a new React Native project in /Users/niu/Desktop/NiuReact  
  3. Installing react-native package from npm...  
  4. Setting up new React Native app in /Users/niu/Desktop/NiuReact  
  5. [email protected] /Users/niu/Desktop/NiuReact  
  6. └── [email protected]   
  7.   
  8. npm WARN deprecated [email protected]: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue  
  9. npm WARN prefer global [email protected] should be installed with -g  
  10. [email protected] /Users/niu/Desktop/NiuReact  
  11. ├─┬ [email protected]   
  12. │ ├─┬ [email protected]   
  13. │ │ ├── [email protected]   
  14. │ │ └─┬ [email protected]   
  15. │ │   └── [email protected]   
  16. │ └─┬ [email protected]   
  17. │   └── babel-plugin-jest-hoist@16.  
  18. To run your app on iOS:  
  19.    cd /Users/niu/Desktop/NiuReact  
  20.    react-native run-ios  
  21.    - or -  
  22.    Open /Users/niu/Desktop/NiuReact/ios/NiuReact.xcodeproj in Xcode  
  23.    Hit the Run button  
  24. To run your app on Android:  
  25.    Have an Android emulator running (quickest way to get started), or a device connected  
  26.    cd /Users/niu/Desktop/NiuReact  
  27.    react-native run-android  

2. github上的项目


需要在终端进入github项目目录下运行 npm install 或  npm update


[plain]  view plain  copy
  1. localhost:navigation-master 2 niu$ npm install  
  2. npm WARN deprecated [email protected]: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue  
  3. npm WARN deprecated [email protected]: cross-spawn no longer requires a build toolchain, use it instead!  
  4. npm WARN prefer global [email protected] should be installed with -g  
  5.   
  6. [email protected] install /Users/niu/Desktop/navigation-master 2/node_modules/fsevents  
  7. > node-pre-gyp install --fallback-to-build  
  8.   
  9. [fsevents] Success: "/Users/niu/Desktop/navigation-master 2/node_modules/fsevents/lib/binding/Release/node-v48-darwin-x64/fse.node" is installed via remote  
  10.   
  11. [email protected] install /Users/niu/Desktop/navigation-master 2/node_modules/bufferutil  
  12. > node-gyp rebuild  
  13. [email protected] postinstall /Users/niu/Desktop/navigation-master 2/node_modules/spawn-sync  
  14. > node postinstall  
  15.   
  16. [email protected] /Users/niu/Desktop/navigation-master 2  
  17.    ├── [email protected]   
  18.     ├─┬ [email protected]   
  19.     │ └── [email protected]   
  20.     └── [email protected]   


等安装完了以后查看项目下面有node_modules文件夹跟package.json同级目录,项目正常可以运行起来。


错误一


如果你的环境是 React Native 0.32以下版本 ,Xcode8 会报错

RCTSRWebSocket.m报错

Ignoring return value of function declared with warn_unused_result attribute


这个报错在此文件中有两处,代码

SecRandomCopyBytes(kSecRandomDefault, sizeof(uint32_t), (uint8_t *)mask_key);

修改为

(void)SecRandomCopyBytes(kSecRandomDefault, sizeof(uint32_t), (uint8_t *)mask_key);
前面加上 (void)

RCTScrollView.m 报错

Use of undeclared identifier '_refreshControl'; did you mean 'refreshControl'?

@implementation RCTCustomScrollView
{
  __weak UIView *_dockedHeaderView;
  RCTRefreshControl *_refreshControl;  // 加入此行
}

错误二


如果出现下面错误,




建议将 192.168.25.13 改为localhost,便于开发。


错误三

[plain]  view plain  copy
  1. "std::terminate()", referenced from:  
  2. ___clang_call_terminate in libReact.a(RCTJSCExecutor.o)  
  3. "___cxa_begin_catch", referenced from:  
  4. ___clang_call_terminate in libReact.a(RCTJSCExecutor.o)  
  5. "___gxx_personality_v0", referenced from:  
  6. -[RCTJavaScriptContext initWithJSContext:onThread:] in libReact.a(RCTJSCExecutor.o)  
  7. -[RCTJavaScriptContext init] in libReact.a(RCTJSCExecutor.o)  
  8. -[RCTJavaScriptContext invalidate] in libReact.a(RCTJSCExecutor.o)  
  9. _RCTNSErrorFromJSError in libReact.a(RCTJSCExecutor.o)  
  10. +[RCTJSCExecutor runRunLoopThread] in libReact.a(RCTJSCExecutor.o)  
  11. -[RCTJSCExecutor init] in libReact.a(RCTJSCExecutor.o)  
  12. -[RCTJSCExecutor context] in libReact.a(RCTJSCExecutor.o)  
  13. ...  
  14. ld: symbol(s) not found for architecture x86_64  

在Other Linker Flags中添加-lc++即可

错误四

产生原因 react-native 与 React 用法不匹配 ,React Native 需升级到版本到0.25.1

[plain]  view plain  copy
  1. com.facebook.react.JavaScript] Seems you're trying to access 'ReactNative.createClass' from the 'react-native' package. Perhaps you meant to access 'React.createClass' from the 'react' package instead?  
  2.   
  3. For example, instead of:  
  4.   
  5.   import React, { Component, View } from 'react-native';  
  6.   
  7. You should now do:  
  8.   
  9.   import React, { Component } from 'react';  
  10.   import { View } from 'react-native';  
解决方案  点击打开链接


或 删除node_modules 使用 nam install 重新配置。


3. npm install  


npm install <name>安装nodejs的依赖包

例如npm install express 就会默认安装express的最新版本,也可以通过在后面加版本号的方式安装指定版本,如npm install [email protected]

npm install <name> -g  将包安装到全局环境中

但是代码中,直接通过require()的方式是没有办法调用全局安装的包的。全局的安装是供命令行使用的,就好像全局安装了vmarket后,就可以在命令行中直接运行vm命令

npm install <name> --save  安装的同时,将信息写入package.json中

项目路径中如果有package.json文件时,直接使用npm install方法就可以根据dependencies配置安装所有的依赖包

这样代码提交到github时,就不用提交node_modules这个文件夹了。

npm init  会引导你创建一个package.json文件,包括名称、版本、作者这些信息等

npm remove <name>移除

npm update <name>更新

npm ls 列出当前安装的了所有包

npm root 查看当前的安装路径

npm root -g  查看全局的包的安装路径

npm help  帮助,如果要单独查看install命令的帮助,可以使用的npm help install


4.package.json作用


package.json文件描述了一个NPM包的所有相关信息,包括作者、简介、包依赖、构建等信息。格式必须是严格的JSON格式。

通常我们在创建一个NPM程序时,可以使用npm init命令,通过交互式的命令,自动生成一个package.json文件,里面包含了常用的一些字段信息,但远不止这么简单。通过完善package.json文件,我们可以让npm命令更好地为我们服务。

name

nameversion是package.json中最重要的两个字段,也是发布到NPM平台上的唯一标识,如果没有正确设置这两个字段,包就不能发布和被下载。

下面是官方给出的一些建议:

  • 名字里不要再包含"js"和"node",因为默认NPM包就是node.js程序,不过你可以通过engines字段来指定。
  • 名字将会被作为url的一部分,所有要符合http url的一般命名规则,不能包含url非法字符,也不能以._开头。
  • 名字也将作为require()命令的参数,所以应该尽量简明。
  • 如果包要发布到NPM平台上的话,最好先检查下有没有重名, 并且字母只能全部小写。

新版本的NPM可以指定scope, 名字可以加前缀标识,如@ijse/mypackage

version

这个字段的取值需要符合node-semver的规则,详细可以见其文档。

description

包的描述信息,将会在npm search的返回结果中显示,以帮助用户选择合适的包。

keywords

包的关键词信息,是一个字符串数组,同上也将显示在npm search的结果中。

homepage

包的主页地址

bugs

包的bug跟踪主页地址,应该如下设置:

bugs: {  
  "url": "http://github.com/ijse/project/issues",
  "email": "[email protected]"
}
license

包的开源协议名称

author

包的作者,可以是字符串或对象:

author: {  
  "name": "ijse",
  "email": "[email protected]",
  "url": "http://www.ijser.cn"
}

或者:

author: "ijse <[email protected]> (http://www.ijser.cn)"  
contributors, maintainers

包的贡献者,是一个数组。

files

包所包含的所有文件,可以取值为文件夹。

通常我们还是用.npmignore来去除不想包含到包里的文件。

main

包的入口文件,如index.js

bin

如果你的包里包含可执行文件,通过设置这个字段可以将它们包含到系统的PATH中,这样直接就可以运行,很方便。如:

"bin": {
  "iapp": "./cli.js"
}

当包被安装后,NPM将创建一个cli.js文件的链接到/usr/local/bin/iapp下。

man

为系统的man命令提供帮助文档, 如:

"man": "./man/doc.1"

帮助文件的文件名必须以数字结尾,如果是压缩的,需要以.gz结尾。

如果是字符串数组:

"name": "foo",
"man": ["./man/foo.1", "./man/bar.1", "./man/foo.2" ]

则分别可以man fooman foo-barman 2 foo来查看。

directories

CommonJS包所要求的目录结构信息,目前除了告诉别人你的程序目录结构,貌似没有别的什么用。 
下级字段可以是:lib, bin, man, doc, example。 每个都是字符串

repository

包的仓库地址。如:

"repository": {
  "type": "git",
  "url": "http://github.com/ijse/project.git"
}
scripts

通过设置这个可以使NPM调用一些命令脚本,封装一些功能。

config

添加一些设置,可以供scripts读取用,同时这里的值也会被添加到系统的环境变量中。

"name": "foo",
"config": {
  "port": "8080"
}

npm start的时候会读取到npm_package_config_port环境变量。

同时也可以使用npm config命令来修改设置:

npm config set foo:port 8001  
dependencies

指定依赖的其它包,这些依赖是指包发布后正常执行时所需要的,如果是开发中依赖的包,可以在devDependencies设置。

通常使用下面命令来安装:

npm install --save otherpackage  

形式可以有如下多种:

  • version 严格匹配某个版本
  • >version 必须大于某个版本
  • >=version
  • <version
  • <=version
  • ~version 大概匹配某个版本
  • ^version 兼容某个版本
  • 1.2.x 可以是1.2.0, 1.2.1等等,但不能是1.3.0
  • http://... 指定tarball的url地址
  • * 任何版本都可以
  • "" 同上
  • version1 - version2 >=version1 <=version2
  • range1 || range2 满足range1 或range2
  • git://... git地址
  • user/repo 同上
  • tag 指定某个tag的版本
  • path/path 本地包所有文件夹

下面都是可以用的:

{ "dependencies" :
  { "foo" : "1.0.0 - 2.9999.9999"
  , "bar" : ">=1.0.2 <2.1.2"
  , "baz" : ">1.0.2 <=2.3.4"
  , "boo" : "2.0.1"
  , "qux" : "<1.0.0 || >=2.3.1 <2.4.5 || >=2.5.2 <3.0.0"
  , "asd" : "http://asdf.com/asdf.tar.gz"
  , "til" : "~1.2"
  , "elf" : "~1.2.3"
  , "two" : "2.x"
  , "thr" : "3.3.x"
  , "lat" : "latest"
  , "dyl" : "file:../dyl"
  }
}

Git URL可以有如下种形式: 

git://github.com/user/project.git#commit-ish  
git+ssh://user@hostname:project.git#commit-ish  
git+ssh://user@hostname/project.git#commit-ish  
git+http://user@hostname/project/blah.git#commit-ish  
git+https://user@hostname/project/blah.git#commit-ish  
devDependencies

这些依赖只有在开发时候才需要。

npm install --save-dev mypack  
peerDependencies

相关的依赖,如果你的包是插件,而用户在使用你的包时候,通常也会需要这些依赖(插件),那么可以将依赖列到这里。

举个例子,如karma, 它的package.json中有设置:

"peerDependencies": {
  "karma-jasmine": "~0.1.0",
  "karma-requirejs": "~0.2.0",
  "karma-coffee-preprocessor": "~0.1.0",
  "karma-html2js-preprocessor": "~0.1.0",
  "karma-chrome-launcher": "~0.1.0",
  "karma-firefox-launcher": "~0.1.0",
  "karma-phantomjs-launcher": "~0.1.0",
  "karma-script-launcher": "~0.1.0"
}

这些都是karma的相关插件,一般使用karma的时候都会需要。

bundledDependencies

绑定的依赖包,发布的时候这些绑定包也会被一同发布。

optionalDependencies

即使这些依赖没有,也可以正常安装使用

engines

指定包运行的环境

"engines": {
  "node": ">=0.10.3 < 0.12",
  "npm": "~1.0.20"
}
engineStrict

设置为true强制限定 engine

os

指定你的包可以在哪些系统平台下运行。

"os": [ "darwin", "linux", "!win32" ]

即可以在darwinlinux平台下运行,而不能在win32下。这里设定的取值是来自process.platform的。

cpu

可以指定包运行的cpu架构,如

"cpu": [ "x64", "!arm" ]

取值来自process.arch

preferGlobal

如果你的包是命令行运行的,那可以将其设置为true建议用户全局(npm install -g)安装。但它并不强制用户。

private

设为true这个包将不会发布到NPM平台下。

publishConfig

这个字段用于设置发布时候的一些设定。尤其方便你希望发布前设定指定的tagregistry

也可以设定其它子字段,但只有tagregistry会影响到发布。

NPM的一些默认值说明

  • "scripts": { "start": "node server.js" } 如果在项目根目录下含有server.js文件,则NPM会自动设置此值。

  • "scripts": { "preinstall": "node-gyp rebuild" }

如果在项目根目录下含有binding.gyp文件,则NPM会自动设置此值。

  • "contributors": [...]

如果项目根目录下含有AUTHORS文件,则NPM会自动将每一行以Name <email> (url)的格式读取并设定此字段。





猜你喜欢

转载自blog.csdn.net/happyshaotang2/article/details/78589803