search

tleunen / babel-plugin-module-resolver

Custom module resolver plugin for Babel
MIT License
3.46k stars 205 forks source link

UnableToResolveError: Unable to resolve module #281

Open Vishal-Lakkapathri opened 6 years ago

Vishal-Lakkapathri commented 6 years ago

Unable to find the component. The Application is working fine on MacOS but facing issue on Windows.

I`m using git bash terminal/command prompt to run the packager.

image

Config: Windows 10(64 bit) node: v8.2.1 npm: 5.6.0

.babelrc

  "plugins": [
    ["module-resolver", {
      "alias": {
        "assets": "./app/assets",
        "constants": "./app/constants",
        "components": "./app/components",
        "views": "./app/views",
        "styles": "./app/styles",
        "config": "./app/config",
        "lib": "./app/lib",
        "utils": "./app/utils"
      }
    }]
  ],

package.json

  "dependencies": {
    "axios": "^0.16.2",
    "form-metadata": "^2.0.1",
    "lodash": "^4.17.5",
    "moment": "^2.20.1",
    "prop-types": "^15.6.0",
    "ramda": "^0.25.0",
    "react": "16.0.0-beta.5",
    "react-native": "0.49.3",
    "react-native-action-button": "^2.8.1",
    "react-native-animatable": "^1.2.4",
    "react-native-collapsible": "^0.9.0",
    "react-native-datepicker": "^1.6.0",
    "react-native-easy-grid": "^0.1.15",
    "react-native-firebase": "^3.0.5",
    "react-native-fs": "^2.9.11",
    "react-native-linear-gradient": "^2.4.0",
    "react-native-maps": "^0.18.3",
    "react-native-modal": "^4.1.1",
    "react-native-modal-dropdown": "^0.5.0",
    "react-native-open-maps": "^0.1.1",
    "react-native-signature-capture": "^0.4.9",
    "react-native-step-indicator": "0.0.7",
    "react-native-tab-view": "^0.0.70",
    "react-native-vector-icons": "^4.4.2",
    "react-redux": "^5.0.5",
    "recompose": "^0.26.0",
    "redux": "^3.7.2",
    "redux-form": "^7.1.1",
    "redux-persist": "^4.8.3",
    "redux-thunk": "^2.2.0",
    "remote-redux-devtools": "^0.5.12",
    "render-if": "^0.1.1",
    "reselect": "^3.0.1",
    "styled-components": "^2.2.1"
  },
  "devDependencies": {
    "babel-eslint": "^8.1.1",
    "babel-jest": "21.2.0",
    "babel-plugin-module-resolver": "^2.7.1",
    "babel-preset-flow": "^6.23.0",
    "babel-preset-react-native": "4.0.0",
    "enzyme": "2.9.1",
    "enzyme-to-json": "^1.5.1",
    "eslint": "^4.6.1",
    "eslint-config-airbnb": "^15.1.0",
    "eslint-import-resolver-babel-module": "^3.0.0",
    "eslint-plugin-flowtype": "^2.42.0",
    "eslint-plugin-import": "^2.7.0",
    "eslint-plugin-jsx-a11y": "^5.1.1",
    "eslint-plugin-react": "^7.1.0",
    "flow-bin": "0.53.0",
    "flow-typed": "^2.3.0",
    "husky": "^0.14.3",
    "jest": "21.0.1",
    "jest-cli": "^21.2.1",
    "jest-enzyme": "^3.8.2",
    "jest-serializer-enzyme": "^1.0.0",
    "lint-staged": "^4.1.3",
    "prettier-eslint": "^7.1.0",
    "prettier-eslint-cli": "^4.3.2",
    "react-addons-test-utils": "^15.6.2",
    "react-dom": "^16.0.0-beta.5",
    "react-test-renderer": "16.0.0-beta.5",
    "redux-mock-store": "^1.3.0",
    "remotedev-server": "^0.2.4",
    "rimraf": "^2.6.2"
  },
msmaromi commented 6 years ago

got same problem

kevinNejad commented 6 years ago

npm start -- --reset-cache should resolve the problem. Issue #277 raised regarding need of npm reset cache. the alternative solution to have absolute path is to add a Package.json file in in root directory this should be the content of it : { “name”: “app” }

vykumar commented 6 years ago

@kevinNejad I was also getting same issue of module resolver. So, I tried to resolve the issue by ran the command npm start -- --reset-cache but still facing issue. Could you please explained me clearly your alternative solution because i didn't get what exactly we should do? screenshot_2018-03-07-13-33-13 1

kevinNejad commented 6 years ago

@vykumar I am surprised why it did not resolved by reseting npm cache. but here is the alternative way of having absolute path. if youre trying to define path from root of your project, e.g. 'app/component/...' rather than '../../component/....' Add a package.json file with { “name”: “FOLDER_NAME” } in it to the folder you’d like to import from. app --actions --reducers --components package.json file with { “name”: “app” }

tleunen commented 6 years ago

Yeah, it seems tricky to fix this issue with react-native. I don't exactly know how it works, or how the cache works, but I doubt we can actually do anything about it. There's this other thread about that (#224) and so far, there's no easy fix other than the cache reset...

kevinNejad commented 6 years ago

It very useful package. My assumption is the babelrc file is not loaded by rerunning app. I will have a look at the package later on see if I can spot the reason.It could be because of npm, even if it is, i wouldnt surprise.

entronad commented 6 years ago

Try this way: #292

FE-xiaoJiang commented 6 years ago

224 it's because of the wrong cwd which results in translating the relative dir to a wrong dir