Question

node_modules内的我的本地自定义模块无法访问其父级所拥有的react包。

我有以下代码：

// SomeComponent.js
import React, { Component } from 'react'
import {
  View
} from 'react-native'
import CustomComponent from 'react-native-my-super-components'

export default SomeComponent extends Component {
  render() {
    return (
      <View>
        <CustomComponent />
      </View>
    )
  }
}

我有一个npm link编辑的目录，名为react-native-my-super-components。

// index.js of 'react-native-my-super-components'
import React, { Component } from 'react'
import {
  Text,
  View,
} from 'react-native'

export default SomeComponent extends Component {
  render() {
    return (
      <View>
        <Text>SomeComponent</Text>
      </View>
    )
  }
}

我在包含npm link react-native-my-super-component的项目中调用了SomeComponent.js。

package.json看起来像这样：

{
  "name": "react-native-my-super-component",
  "version": "0.0.1",
  "description": "My Super Component",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "Naoto Ida",
  "license": "MIT",
  "peerDependencies": {
    "react": ">=15.3.2",
    "react-native": ">=0.35.0"
  }
}

我认为与其他node_modules相比没有任何差异。可能导致这种情况的原因是什么？

Answer 1

从react解析react-native-my-super-component时，节点将在react-native-my-super-component文件夹或react-native-my-super-component父母的node_modules中搜索。

使用npm link时，您无法使模块解析系统以相同的方式工作。

所以你可以：

安装所需的缺失依赖项作为＆dev; dev依赖＆＃39;在react-native-my-super-component文件夹
对于React，必须是单身，您必须在webpack配置文件中创建一个别名，以解决“反应”问题。来自每个链接模块的方式相同。

例如在你的webpack配置文件中，以dev模式添加：

    {
        resolve: {
            alias: [
                'react': path.join(process.cwd(), 'node_modules/react')
            ]
        }
    }

此解决方案需要模块＆＃39;路径＆＃39;创建一个反应模块的绝对路径:( import path from 'path';）但你可以先尝试一个静态路径。

添加本地npm依赖项时找不到React模块

1 个答案: