Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Question: How to use with Expo #203

Closed
FleetAdmiralJakob opened this issue Mar 3, 2024 · 3 comments
Closed

Question: How to use with Expo #203

FleetAdmiralJakob opened this issue Mar 3, 2024 · 3 comments

Comments

@FleetAdmiralJakob
Copy link

I saw that this library supports expo but does not know how to implement it.

@drazik
Copy link

drazik commented Mar 4, 2024

I don't know if I'm doing this right, but here is what I did and is working:

  • create a env.ts file with my environment variables schema:
import { createEnv } from "@t3-oss/env-core"
import { z } from "zod"

export const env = createEnv({
	clientPrefix: "EXPO_PUBLIC_",
	client: {
		EXPO_PUBLIC_GOOGLE_MAPS_API_KEY: z.string().min(1),
		EXPO_PUBLIC_API_BASE_URL: z.string().url(),
	},
	runtimeEnv: {
		EXPO_PUBLIC_GOOGLE_MAPS_API_KEY:
			process.env.EXPO_PUBLIC_GOOGLE_MAPS_API_KEY,
		EXPO_PUBLIC_API_BASE_URL: process.env.EXPO_PUBLIC_API_BASE_URL,
	},
})
  • create a .env file that contains all my environment variables with fake values: this file is versioned as a reference for all the environment variables that should be filled in the project
  • create a .env.local file that contains the environment variables with real values: this file in git ignored

Then use the env object

import { env } from "@/env"

env.EXPO_PUBLIC_GOOGLE_MAPS_API_KEY

I hope it helps!

@tyeetale
Copy link

tyeetale commented Mar 24, 2024

also, I found a typescript issue when importing, so I added:

"@t3-oss/env-core": ["./node_modules/@t3-oss/env-core/dist/index.d.ts"]

to the paths section in tsconfig.json:

{
  "extends": "expo/tsconfig.base",
  "compilerOptions": {
    "strict": true,
    "module": "ESNext",
    "paths": {
      "@t3-oss/env-core": ["./node_modules/@t3-oss/env-core/dist/index.d.ts"]
    }
  },
  "include": ["**/*.ts", "**/*.tsx"]
}

@juliusmarminge
Copy link
Member

juliusmarminge commented Mar 24, 2024

also, I found a typescript issue when importing, so I added:

That's most likely related to a bad moduleResolution setting in your tsconfig (or the expo base config you're extending from) See #189, #190, #191, #195 etc

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants