Problem with aliases

[kacluk123]

Babel resolver does not work in my next.js project

My .babelrc file

    {
      "presets": ["next/babel"],
      "plugins": [
        [
          "module-resolver",
          {
            "root": ["./"],
            "alias": {
              "@components": "./src/components",
            }
          }
        ],
        ["styled-components", { "ssr": true }]
      ]
    }

My tsconfig

    "paths": {
      "@components/*": ["./src/components/*"],
      "baseUrl": "."
     },

And when im trying to use it like that

    import Login from '@components/login'

    export default Login

vscode throws an error

Cannot find module '@components/login' or its corresponding type declarations.

[patrickyyang]

I have the same error, Did you fix this?

[chunhoong]

Assume everything is correct- Perhaps try to restart TypeScript language server in vscode?

[MariusCatanoiu]

This worked for me:

• I removed node_modules
• yarn install
• pod install
• run

  watchman watch-del-all && rm -rf $TMPDIR/react-native-packager-cache-* &&
  rm -rf $TMPDIR/metro-bundler-cache-* && rm -rf node_modules/ && npm cache clean --force &&
  npm install && npm start -- --reset-cache

And I use it like this import { AppStateHandler, FocusListeners, LoadingContainer } from '@components';

[Nantris]

This is TS2307. @kacluk123 it's good practice to include the error code, not just the text.

Anybody know how to fix it?

@MariusCatanoiu can you clarify what you mean? You were able to get this working?

[MariusCatanoiu]

This is TS2307. @kacluk123 it's good practice to include the error code, not just the text.

Anybody know how to fix it?

@MariusCatanoiu can you clarify what you mean? You were able to get this working?

I updated the previous comment