Please help me!
React-Native
IDE:WebStorm
System:Windows
NPM:6.1.0
My:
npm install --save-dev babel-plugin-module-resolver
Edit .babelrc
{
"presets": ["react-native"],
"plugins": [
[
"module-resolver",
{
"root": ["./src/test"],
"extensions": [".js", ".ios.js", ".android.js"]
}
]
]
}
Edit App.js
import React, { Component } from 'react';
import HAHA from "root/haha"; //!!!!!!!!!!!!!
import {
Platform,
StyleSheet,
Text,
View
} from 'react-native';
Next:
react-native run-android
Error:
error: bundling failed: Error: Unable to resolve module `root/haha` from `D:\RNWork\untitled3\App.js`: Module `root/haha` does not exist in the Haste module map
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 Metro Bundler cache: `rm -rf /tmp/metro-bundler-cache-*` or `npm start -- --reset-cache`. 4. Remove haste cache: `rm -rf /tmp/haste-map-react-native-packager-*`.
at ModuleResolver.resolveDependency (D:\RNWork\untitled3\node_modules\metro\src\node-haste\DependencyGraph\ModuleResolution.js:161:1460)
at ResolutionRequest.resolveDependency (D:\RNWork\untitled3\node_modules\metro\src\node-haste\DependencyGraph\ResolutionRequest.js:91:16)
at DependencyGraph.resolveDependency (D:\RNWork\untitled3\node_modules\metro\src\node-haste\DependencyGraph.js:272:4579)
at dependencies.map.relativePath (D:\RNWork\untitled3\node_modules\metro\src\DeltaBundler\traverseDependencies.js:376:19)
at Array.map (<anonymous>)
Please help me!
Please help me!
I don't know how I can help you. Did you follow the instructions listed below the error? What's the context? In any case there are already issues open for React Native and this one seems to be the same problem, so I'm closing it.
We don't have a good support for React Native and you can help by contributing a fix to the problem.
To all who are coming here looking for a solution, I had to do the following to fix this issue on React Native:
Updated my .babelrc to the following.
{
"presets": ["react-native"],
"plugins": [
["module-resolver", {
"root": ["./src"],
"extensions": [".js", ".ios.js", ".android.js"],
"alias": {
"api": "./src/api",
"components": "./src/components",
...
}
}]
}
Note that I had to set the root path on each individual module.
"components": "components" -> "components": "./src/components"
I suppose something broke with react native or with babel-plugin-module-resolver which caused the "root" element to be ignored. It used to work.
@TylerMcCraw
Worked for me, thank you very much!
Most helpful comment
To all who are coming here looking for a solution, I had to do the following to fix this issue on React Native:
Updated my .babelrc to the following.
Note that I had to set the root path on each individual module.
"components": "components"->"components": "./src/components"I suppose something broke with react native or with babel-plugin-module-resolver which caused the "root" element to be ignored. It used to work.