-
-
Notifications
You must be signed in to change notification settings - Fork 48
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
Error when importing #457
Comments
You should include env.d.ts to your tsconfig.ts file, like this:
|
@rodrigodiasf1984 try to delete And about |
Sorry, but I don't see how removing the eslint-disable for any could help ; I've used this "/* eslint-disable @typescript-eslint/no-explicit-any */" because I don't know how to type the ref of googleAutocomplete correctly, so I add this to avoid the error |
Hello, did you find any solution? I'm facing by the same issue |
Not yet, let me know if you find it. |
@rodrigodiasf1984 @ser-emejia try to add this:
Because you override these values when you extend your configuration |
Hi @exzos28 It doesn´t work for me, And now I'm getting a lot of errors after adding the include on my tsconfig.json |
@rodrigodiasf1984 anyway it's not a problem of this package, you should find why your ts config doesn't work |
On my side, removing |
Hi erwannbst, I didn't the include on my tsconfig and I'm still getting the error, I've tried to delete, mobe the env.d.ts to the root of the project but the error persist. |
This is the config I use which is working for me : {
"extends": "@tsconfig/react-native/tsconfig.json",
"exclude": ["node_modules"],
"compilerOptions": {
"jsx": "react",
"paths": {
"@/*": ["./features/*"],
"typeRoots": ["./src/types"]
}
}
} babel.config.js module.exports = {
presets: ["module:metro-react-native-babel-preset"],
plugins: [
[
"module:react-native-dotenv",
{
envName: "APP_ENV",
moduleName: "@env",
path: ".env",
blocklist: null,
allowlist: null,
safe: true,
allowUndefined: false,
verbose: false,
},
],
],
}; My |
@erwannbst thanks for your answer, I've tried what you said, but it didn't work for me. |
hi i was able to recreate this issue. I'm working on it. |
react-native-dotenv should be a dev dependency (I see this mistake in your code) here's what I tried:
Every time I get a weird error, I make sure to run If you are using
I tried
|
Hi @goatandsheep thanks for your help! I've moved this package to dev dependencies but I can't remove "node_modules/@types" from typeRoots, if I do, I get errors with jest everywhere. Take a look at the image bellow: with the modifications you suggest, I'm still getting the same typescript error: this is my babel.config.js
|
There's two options I recommend:
if that doesn't work: 2) rename env.d.ts declare module 'react-native-dotenv' {
... babel.config.js ...
moduleName: 'react-native-dotenv'
... index.tsx import {GOOGLE_MAPS_APIKEY} from 'react-native-dotenv' |
Hi @goatandsheep thanks for your help, i've tried what you suggested and the typescript error has gone when I use the process.env.GOOGLE_MAPS_APIKEY but the maps don't work as expected. So I reverted the modifications and kept using the /* eslint-disable import/no-unresolved */ |
Okay I spent the past 2 days figuring out issues with the library and will be overhauling docs again in a few days. Take a look at the wiki for the docs Todo if you need an immediate answer. |
Second variant helped me
my tsconfig.json {
...
"include": [
"./src/**/*",
"./App.tsx",
"./types/env.d.ts",
"./types/index.d.ts"
]
...
} my babel.config.js module.exports = {
presets: ['module:@react-native/babel-preset'],
plugins: [
[
'module:react-native-dotenv',
{
moduleName: 'react-native-dotenv',
},
],
],
}; env.d.ts declare module 'react-native-dotenv' {
...
} |
Worked for me but when I used "react-native-dotenv" as the module name, TypeScript was having issues resolving stuff, so I used "dotenv" instead and it worked. |
Describe the bug
Hi guys I'm getting this error when import the GOOGLE_MAPS_APIKEY from '@env'
I've followed the official documentation, an previous issue and this tutorial, sorry but I don't know what I'm missing.
To Reproduce
Steps to reproduce the behavior:
Expected behavior
import the env var without error
Screenshots
Desktop (please complete the following information):
Smartphone (please complete the following information):
Additional context
Babel-config:
module.exports = {
presets: ['module:metro-react-native-babel-preset'],
plugins: [
'nativewind/babel',
'react-native-reanimated/plugin',
[
'module:react-native-dotenv',
{
moduleName: '@env',
path: '.env',
allowUndefined: false,
},
],
],
};
env.d.ts
declare module '@env' {
export const GOOGLE_MAPS_APIKEY: string;
}
package json:
"dependencies": {
"@aws-amplify/api": "^5.4.4",
"@gorhom/bottom-sheet": "^4.4.5",
"@hookform/resolvers": "^2.9.10",
"@notifee/react-native": "^7.8.0",
"@react-native-async-storage/async-storage": "^1.17.11",
"@react-native-community/datetimepicker": "^6.7.5",
"@react-native-community/netinfo": "^9.3.7",
"@react-native-firebase/app": "^14.11.0",
"@react-native-firebase/messaging": "^14.11.0",
"@react-native-masked-view/masked-view": "0.2.8",
"@react-navigation/native": "^6.0.13",
"@react-navigation/native-stack": "^6.9.1",
"@react-navigation/stack": "^6.3.4",
"@shopify/flash-list": "^1.4.2",
"aws-amplify": "^5.0.14",
"clsx": "^1.2.1",
"date-fns": "^2.29.3",
"lottie-react-native": "^5.1.6",
"nativewind": "^2.0.11",
"phosphor-react-native": "^1.1.2",
"react": "18.1.0",
"react-hook-form": "^7.39.4",
"react-native": "0.70.6",
"react-native-actions-sheet": "^0.8.29",
"react-native-background-fetch": "4.1.5",
"react-native-background-geolocation": "4.10.1",
"react-native-biometrics": "^3.0.1",
"react-native-confirmation-code-field": "^7.3.1",
"react-native-contacts": "^7.0.5",
"react-native-device-info": "^10.4.0",
"react-native-dotenv": "^3.4.9",
"react-native-dropdown-picker": "^5.4.6",
"react-native-flash-message": "^0.4.0",
"react-native-floating-label-input": "^1.4.2",
"react-native-gesture-handler": "~2.8.0",
"react-native-google-places-autocomplete": "^2.5.1",
"react-native-image-crop-picker": "^0.37.3",
"react-native-iphone-x-helper": "^1.3.1",
"react-native-maps": "^1.3.2",
"react-native-modal-datetime-picker": "^14.0.1",
"react-native-open-maps": "^0.4.0",
"react-native-permissions": "^3.6.1",
"react-native-phone-number-input": "^2.1.0",
"react-native-ratings": "^8.1.0",
"react-native-reanimated": "^2.14.4",
"react-native-responsive-screen": "^1.4.2",
"react-native-safe-area-context": "4.4.1",
"react-native-screens": "~3.18.0",
"react-native-splash-screen": "^3.3.0",
"react-native-svg": "^13.9.0",
"react-native-svg-transformer": "^1.0.0",
"react-native-swipe-gestures": "^1.0.5",
"react-native-swipe-list-view": "^3.2.9",
"react-native-tooltip-2": "^0.1.3",
"react-native-version-check": "^3.4.7",
"react-native-webview": "^13.2.3",
"redux-persist": "^6.0.0",
"rn-swipe-button": "^1.3.8",
"tailwindcss": "3.3.2",
"yup": "^0.32.11",
"zustand": "^4.3.6"
},
"devDependencies": {
"@babel/core": "^7.12.9",
"@babel/runtime": "^7.12.5",
"@testing-library/jest-native": "^5.4.1",
"@testing-library/react-native": "^11.5.1",
"@tsconfig/react-native": "^2.0.2",
"@types/jest": "^29.4.0",
"@types/react": "^17.0.43",
"@types/react-native": "^0.70.11",
"@types/react-native-dotenv": "^0.2.0",
"@types/react-native-version-check": "^3.4.5",
"@types/react-test-renderer": "^18.0.0",
"@typescript-eslint/eslint-plugin": "^6.4.0",
"babel-plugin-module-resolver": "^5.0.0",
"eslint": "^8.0.1",
"eslint-config-airbnb": "^19.0.4",
"eslint-config-airbnb-typescript": "^17.1.0",
"eslint-config-prettier": "^9.0.0",
"eslint-config-standard-with-typescript": "^39.0.0",
"eslint-import-resolver-babel-module": "^5.3.2",
"eslint-plugin-import": "^2.28.1",
"eslint-plugin-jsx-a11y": "^6.7.1",
"eslint-plugin-n": "^15.0.0 || ^16.0.0 ",
"eslint-plugin-prettier": "^5.0.0",
"eslint-plugin-promise": "^6.0.0",
"eslint-plugin-react": "^7.33.2",
"eslint-plugin-react-hooks": "^4.6.0",
"eslint-plugin-react-native": "^4.0.0",
"jest": "^29.6.4",
"jest-transform-stub": "^2.0.0",
"metro-react-native-babel-preset": "0.72.3",
"prettier": "^3.0.3",
"react-native-clean-project": "^4.0.1",
"react-test-renderer": "^18.2.0",
"typescript": "*"
},
"resolutions": {
"@types/react": "17.0.43",
"@types/react-native": "~0.70.6"
}
}
The text was updated successfully, but these errors were encountered: