Cannot find module '@env' or its corresponding type declarations

Question

Why I get this TypeScript error message and how can I fix it ?

Cannot find module '@env' or its corresponding type declarations

This occurs when I use this:

import { FB_ID } from '@env';

Tt should be named not @env, it should named 'react-native-dotenv' but in my config I named it @env so I can use it, and I can retrieve the FB_ID value. It works but I get a TypeScript error.

This is where I set the moduleName:

      ['module:react-native-dotenv', {
        "envName": "APP_ENV",
        "moduleName": "@env",
        "path": ".env",
        "blocklist": null,
        "allowlist": null,
        "safe": false,
        "allowUndefined": true,
        "verbose": false
      }]

So how can I fix it ?

tsconfig:

{
  "extends": "expo/tsconfig.base",
  "compilerOptions": {
    "strict": true,
    "baseUrl": ".", // this must be specified if "paths" is specified.
    "paths": {
      "@env": ["node_modules/react-native-dotenv"] // this mapping is relative to "baseUrl"
    }
  }
}

Answer 1

• Create a types folder in your source folder.
• Create a file named env.d.ts in the types folder.
• Define your env variables as strings.

  declare module '@env' {
    export const FB_ID: string;
  
    // other ones
  }
  

Answer 2

You should probably look at the paths property of the compilerOptions of your tsconfig file which looks like something alongs the line of:

{
  "compilerOptions": {
    "baseUrl": ".", // this must be specified if "paths" is specified.
    "paths": {
      "@env": ["node_modules/<path to the module dist>"] // this mapping is relative to "baseUrl"
    }
  }
}

This will tell to typescript that @env point to the module and will stopped throwing errors about it. Otherwise it has no idea about the resolution of it and will only look for node_modules/@env