Я пытаюсь добавить redux с помощью набора инструментов redux в существующее приложение для реагирования с моей первой попыткой атомарного дизайна.
Я обернул свои компоненты index.js в <Provider>
для документов, но похоже, что react-redux ищет место под названием 'src / redux', которое выдает ошибку.
Первоначально я пытался объединить все функции redux в папке src / redux и использовал jsonconfig.json для псевдонима _redux для пути src / redux с вложенными папками и файлами index.js, указывающими на действия вложенных папок, «redux» и «магазин».
Я столкнулся с некоторыми ошибками и подумал, что, вероятно, иметь папку с именем redux - плохой тон, поэтому я изменил ее на appRedux, и тогда появилась эта проблема.
Я отбрасывал node_modules и переустанавливал несколько раз, очищал кеши метро, искал любую ссылку на 'src / redux' в приложении и, наконец, начал снова с нуля, сбросив git в HEAD и снова добавив appRedux и новые модули, только чтобы встретить та же ошибка. Теперь я предполагаю, что, возможно, проблема с именованием папок была просто совпадением, но я не знаю, как ее решить.
Есть указатели? В redux-toolkit не так много возможностей с react native, и я бы предпочел не писать весь шаблонный код redux.
Полная ошибка:
error: Error: Unable to resolve module `../../../../src/redux` from `node_modules/react-redux/lib/connect/mapDispatchToProps.js`:
None of these files exist:
* src/redux(.native|.android.js|.native.js|.js|.android.json|.native.json|.json|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx|.android.svg|.native.svg|.svg)
* src/redux/index(.native|.android.js|.native.js|.js|.android.json|.native.json|.json|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx|.android.svg|.native.svg|.svg)
at ModuleResolver.resolveDependency (/APPDIR/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:163:15)
at ResolutionRequest.resolveDependency (/APPDIR/node_modules/metro/src/node-haste/DependencyGraph/ResolutionRequest.js:52:18)
at DependencyGraph.resolveDependency (/APPDIR/node_modules/metro/src/node-haste/DependencyGraph.js:287:16)
at Object.resolve (/APPDIR/node_modules/metro/src/lib/transformHelpers.js:267:42)
at /APPDIR/node_modules/metro/src/DeltaBundler/traverseDependencies.js:434:31
at Array.map (<anonymous>)
at resolveDependencies (/APPDIR/node_modules/metro/src/DeltaBundler/traverseDependencies.js:431:18)
at /APPDIR/node_modules/metro/src/DeltaBundler/traverseDependencies.js:275:33
at Generator.next (<anonymous>)
at asyncGeneratorStep (/APPDIR/node_modules/metro/src/DeltaBundler/traverseDependencies.js:87:24)
package.json:
{
"name": "*APPNAME*",
"version": "*VERSION*",
"private": true,
"scripts": {
"android": "react-native run-android",
"ios": "react-native run-ios",
"start": "react-native start",
"test": "jest",
"lint": "eslint ."
},
"dependencies": {
"@react-native-community/masked-view": "^0.1.10",
"@react-navigation/native": "^5.6.0",
"@react-navigation/stack": "^5.5.1",
"@reduxjs/toolkit": "^1.4.0",
"axios": "^0.19.2",
"compare-versions": "^3.6.0",
"react": "16.11.0",
"react-devtools": "^4.7.0",
"react-native": "0.62.2",
"react-native-camera": "^3.31.0",
"react-native-elements": "^2.0.2",
"react-native-gesture-handler": "^1.6.1",
"react-native-reanimated": "^1.9.0",
"react-native-safe-area-context": "^3.0.6",
"react-native-screens": "^2.9.0",
"react-native-sensitive-info": "^5.5.5",
"react-native-svg": "^12.1.0",
"react-native-svg-transformer": "^0.14.3",
"react-native-vector-icons": "^6.6.0",
"react-native-version-number": "^0.3.6",
"react-navigation": "^4.3.9",
"react-redux": "^7.2.0",
"redux": "^4.0.5"
},
"devDependencies": {
"@babel/core": "^7.10.2",
"@babel/runtime": "^7.10.2",
"@react-native-community/eslint-config": "^1.1.0",
"babel-jest": "^26.0.1",
"babel-plugin-module-resolver": "^3.2.0",
"eslint": "^7.2.0",
"eslint-import-resolver-babel-module": "^5.1.0",
"eslint-plugin-import": "^2.18.2",
"jest": "^26.0.1",
"metro-react-native-babel-preset": "^0.59.0",
"react-test-renderer": "16.11.0"
},
"jest": {
"preset": "react-native"
}
}
jsonconfig.json:
{
"compilerOptions": {
"baseUrl": ".",
"paths": {
"_assets": ["src/assets/*"],
"_components": ["src/components/*"],
"_atoms": ["src/components/atoms/*"],
"_molecules": ["src/components/molecules/*"],
"_organisms": ["src/components/organisms/*"],
"_navigations": ["src/navigations/*"],
"_scenes": ["src/scenes/*"],
"_services": ["src/services/*"],
"_styles": ["src/styles/*"],
"_utils": ["src/utils/*"],
"_app_redux": ["src/appRedux/*"]
}
}
}
src / index.js:
import 'react-native-gesture-handler';
import React from 'react';
import {NavigationContainer} from '@react-navigation/native';
import {createNativeStackNavigator} from 'react-native-screens/native-stack';
import {Provider} from 'react-redux';
import {store} from '_app_redux';
import {*VARIOUS_SCENES*} from '_scenes';
const Stack = createNativeStackNavigator();
const App: () => React$Node = () => {
return (
<Provider store={store}>
<NavigationContainer>
<Stack.Navigator initialRouteName="*INITIAL_SCENE*" mode="modal">
*<VARIOUS_SCENES>*
</Stack.Navigator>
</NavigationContainer>
</Provider>
);
};
export default App;
src / appRedux / store / store.js:
import {configureStore} from '@reduxjs/toolkit';
export default configureStore({
reducer: {},
});
../../../../src/redux
- person Ugur   schedule 16.07.2020import { createStore } from 'redux';
с причудливыми скобками - person Ugur   schedule 16.07.2020@reduxjs/toolkit
доconfigureStore
. В противном случае, возможно, я что-то упустил, потому что нигде не пользуюсь createStore. - person peekay   schedule 16.07.2020