React Native常见报错

常见报错:Error:Cannot find module 'jest-haste-map'

Error: Cannot find module 'jest-haste-map'
    at Function.Module._resolveFilename (module.js:547:15)
    at Function.Module._load (module.js:474:25)
    at Module.require (module.js:596:17)
    at require (internal/module.js:11:18)

解决办法:npm install jest-haste-map --save

npm install jest-haste-map --save
npm WARN @babel/plugin-check-constants@7.0.0-beta.38 requires a peer of @babel/core@7.0.0-beta.38 but none is installed. You must install peer dependencies yourself.

+ jest-haste-map@23.4.1
added 4 packages and updated 1 package in 19.344s

Property right of AssignmentExpression expected node to be of a type ["Expression"] but instead got null

解决办法:修改package.json文件devDependencies增加,修改.babelrc文件

    "@babel/plugin-proposal-decorators": "7.0.0-beta.47",
    "babel-preset-react-native": "5.0.1",

WechatIMG816.jpeg

{
  "presets": [
    "react-native"
  ],
  "plugins": [
   ["@babel/plugin-proposal-decorators", { "legacy": true }]
  ],
  "env": {
    "production": {
      "plugins": [
        "transform-remove-console"
      ]
    }
  }
}

WX20180806-224032@2x.png

Cannot read property...

node_modules/react-native/Libraries/react-native/react-native-
implementation.js: Cannot read property 'bindings' of null (null))

解决办法:npm i babel-preset-react-native@5

Bundling index.ios.js 99.0% (405/407), failed.

This might be related to https://github.com/facebook/react-native/issues/4968
To resolve try the following:
  1. Clear watchman watches: `watchman watch-del-all`.
  2. Delete the `node_modules` folder: `rm -rf node_modules && npm install`.
  3. Reset packager cache: `rm -fr $TMPDIR/react-*` or `npm start -- --reset-cache`.

解决办法:

watchman watch-del-all
rm -rf node_modules && npm install
npm start --reset-cache

react-native.js: Unable to find this module in its module map or any of the node_modules directories

解决办法:

npm i --save react@15.0.2

Bundling failed: Error: Unable to resolve module react-native-tab-view

解决办法:

npm i github:react-navigation/react-native-tab-view

You are currently using minified code outside of NODE_ENV === 'production'. This means that you are running a slower development build of Redux

解决办法:在RN代码里面全局查找process.env.NODE_ENV将其值设为production,可能其值现在为development。

const global_def = `(function (global) {global.__DEV__=false;global.__BUNDLE_START_TIME__=this.nativePerformanceNow?nativePerformanceNow():Date.now();global.process=this.process||{};global.process.env=process.env||{};global.process.env.NODE_ENV='production';})(this);`

[React-native: Super expression must either be null or a function, not undefined]

解决办法:修改引入Component方式。

import React, { Component } from 'react';
import {
  AppRegistry,
  StyleSheet,
  Text,
  View,
  Image,
  TextInput,
  Button,
  TouchableHighlight,
} from 'react-native';

[React native: Cannot add a child that doesn't have a YogaNode or parent node(Trying to add a 'ReactRawTextShadowNode' to a 'LayoutShadowNode')]

      <View style={[styles.container]}>
      <BoxShadow setting={shadowOpt}>
                <TouchableOpacity style={{
                    position:"relative",
                    width: 160,
                    height: 170,
                    backgroundColor: "#fff",
                    borderRadius:3,
                    // marginVertical:5,
                    overflow:"hidden"}}>
                    测试
                </TouchableOpacity>
            </BoxShadow>
      </View>

解决办法：删除组件里面的含有"//"注释,删除//marginVertical:5这一行，还是报错，后来发现TouchableOpacity里面不能直接添加汉字，需要加Text。

   <BoxShadow setting={shadowOpt}>
                <TouchableOpacity style={{
                    position:"relative",
                    width: 160,
                    height: 170,
                    backgroundColor: "#fff",
                    borderRadius:3,
                    overflow:"hidden"}}>
                    <Text>测试</Text>
                </TouchableOpacity>
            </BoxShadow>

或

   <BoxShadow setting={shadowOpt}>
                <TouchableOpacity style={{
                    position:"relative",
                    width: 160,
                    height: 170,
                    backgroundColor: "#fff",
                    borderRadius:3,
                    overflow:"hidden"}}>
                    {!!'测试'}
                </TouchableOpacity>
            </BoxShadow>

后面这一种测试二字显示不出来，为了防止崩溃，加两个！！将"测试"取两次反，转化为BOOL防止为空。