After installing the react-native-dotenv library, I followed the instructions outlined in the TypeScript guide.
I then created a .env file with the following contents:
MARVEL_API = <url>
MARVEL_PUBLIC_KEY = <public-key>
MARVEL_PRIVATE_KEY = <private-key>
In my babel.config.js file, under the presets section, I added the below options:
'module:react-native-dotenv',
{
moduleName: '@env',
path: '.env',
whitelist: ['MARVEL_API', 'MARVEL_PUBLIC_KEY', 'MARVEL_PRIVATE_KEY'],
safe: false,
allowUndefined: true,
},
To declare the @env module, I created a types folder containing an end.d.ts file with the following content:
declare module '@env' {
export const MARVEL_API: string;
export const MARVEL_PUBLIC_KEY: string;
export const MARVEL_PRIVATE_KEY: string;
}
Upon saving the files, however, I encountered the following error:
error: index.js: [BABEL] /home/vagner/Documents/www/objective/index.js: Unknown option: .name. Check out https://babeljs.io/docs/en/babel-core/#options for more information about options.
I attempted to resolve this by running yarn start --reset-cache, but unfortunately, it did not work as expected.