Search code examples
reactjsreact-nativeexpodotenv

React native expo .env file

I've created a react native app with expo.I installed the dotenv package, I want to make a .env file and use it but I get an error saying Unable to resolve @env from .... I've read a bunch of articles and blog post about using .env files in expo but I couldn't figure out how to fix it. Here is the code:

babel.config.js

module.exports = function (api) {
  api.cache(true);
  return {
    presets: ["babel-preset-expo", "module:react-native-dotenv"],
  };
};

.env

PORT=8082

App.js

import React from "react";
import {View,Text} from "react-native";

import {PORT} from "@env";

export function App() {
return (
  <View><Text>{PORT}</Text></View>
);
}
Solution

  • Try putting "module:react-native-dotenv" in plugins like so:

    module.exports = function (api) {
  api.cache(true);
  return {
    presets: ["babel-preset-expo"],
    plugins: [["module:react-native-dotenv"]],
  };
};

    Don't forget to restart your expo/npm server after.