#reactjs #react-native
#reactjs #react-native
Вопрос:
Мой локальный пользовательский модуль внутри 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" amp;amp; exit 1"
},
"author": "Naoto Ida",
"license": "MIT",
"peerDependencies": {
"react": ">=15.3.2",
"react-native": ">=0.35.0"
}
}
Я не вижу никаких различий по сравнению с другими node_modules
. Что может быть причиной этого?
Ответ №1:
При разрешении react
из react-native-my-super-component
node будет выполнять поиск в node_modules из react-native-my-super-component
папки или у react-native-my-super-component
родителей.
Вы не можете заставить систему разрешения модулей работать таким же образом при использовании npm link
.
Таким образом, вы можете:
- установите требуемую отсутствующую зависимость как ‘dev dependency’ в
react-native-my-super-component
папку - для React, который должен быть синглтоном, вы должны создать псевдоним в вашем конфигурационном файле webpack, чтобы разрешить ‘react’ из каждого связанного модуля одинаково.
например, в вашем конфигурационном файле webpack добавьте в режиме разработки:
{
resolve: {
alias: [
'react': path.join(process.cwd(), 'node_modules/react')
]
}
}
Для этого решения требуется ‘path’ модуля для создания абсолютного пути к вашему модулю react: ( import path from 'path';
) но в вы можете сначала попробовать статический путь.
Комментарии:
1. Спасибо за ответ. Итак, если я могу отправить свой
react-native-my-super-component
в удаленное репозиторий, должен ли я просто сделать это иnpm install
? Я уже использовал webpack раньше для переноса с ES6 на старый JS, но не так часто с такого рода проектами.2. ДА. Используйте
npm link
, чтобы иметь возможность работать с вашим основным проектомreact-native-my-super-component
, когда в нем запущен собственный процесс разработки. Затем в prod или приreact-native-my-super-component
отправке в удаленное репозиторий просто используйтеnpm install react-native-my-super-component
.