search

aws-amplify / amplify-backend

Home to all tools related to Amplify's code-first DX (Gen 2) for building fullstack apps on AWS
Apache License 2.0
175 stars 61 forks source link

Conversion of type 'ProcessEnv' to type 'LambdaProvidedEnvVars & AmplifyBackendEnvVars' may be a mistake #1854

Open vinothj-aa opened 2 months ago

vinothj-aa commented 2 months ago

Environment information

System:
  OS: macOS 14.5
  CPU: (10) arm64 Apple M1 Pro
  Memory: 144.94 MB / 16.00 GB
  Shell: /bin/zsh
Binaries:
  Node: 22.6.0 - ~/.nvm/versions/node/v22.6.0/bin/node
  Yarn: undefined - undefined
  npm: 10.8.2 - ~/.nvm/versions/node/v22.6.0/bin/npm
  pnpm: undefined - undefined
NPM Packages:
  @aws-amplify/backend: 1.0.3
  @aws-amplify/backend-cli: 1.0.4
  aws-amplify: 6.3.7
  aws-cdk: 2.147.0
  aws-cdk-lib: 2.147.0
  typescript: 5.5.2
AWS environment variables:
  AWS_STS_REGIONAL_ENDPOINTS = regional
  AWS_NODEJS_CONNECTION_REUSE_ENABLED = 1
  AWS_SDK_LOAD_CONFIG = 1
No CDK environment variables

Description

I'm running to an issue in personal cloud sandbox environment with the error:

.amplify/generated/env/add-user-to-group.ts(2,20): error TS2352: Conversion of type 'ProcessEnv' to type 'LambdaProvidedEnvVars & AmplifyBackendEnvVars' may be a mistake because neither type sufficiently overlaps with the other. If this was intentional, convert the expression to 'unknown' first.
  Type 'ProcessEnv' is missing the following properties from type 'LambdaProvidedEnvVars': _HANDLER, _X_AMZN_TRACE_ID, AWS_DEFAULT_REGION, AWS_REGION, and 20 more.
TypeScript validation check failed.
Resolution: Fix the syntax and type errors in your backend definition.

This is leading to build failures in Amplify as well.

Since the file that throws this error is an auto generated file by Amplify, I'm not sure how to fix this issue!

Steps tried by me:

Additional Details:

./tsconfig.json
{
  "compilerOptions": {
    "target": "es2017",
    "lib": ["dom", "dom.iterable", "esnext"],
    "allowJs": true,
    "skipLibCheck": true,
    "strict": true,
    "noEmit": true,
    "esModuleInterop": true,
    "module": "esnext",
    "moduleResolution": "bundler",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "jsx": "preserve",
    "incremental": true,
    "plugins": [
      {
        "name": "next"
      }
    ],
    "paths": {
      "@/*": ["./*"]
    }
  },
  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
  "exclude": ["node_modules", ".amplify", "./amplify"]
}

I couldn't find help in the Amplify documentation and online as well. I would really appreciate it if someone could help me.

ykethan commented 2 months ago

Hey @vinothj-aa, could you update the exclude with the following and retry

"exclude": ["node_modules", "amplify/**/*"]
vinothj-aa commented 2 months ago

Hey @vinothj-aa, could you update the exclude with the following and retry

"exclude": ["node_modules", "amplify/**/*"]

Hi @ykethan, thank you for your response. I just realised that there are 2 tsconfig.json files.

1. ./tsconfig.json
{
  "compilerOptions": {
    "target": "es2017",
    "lib": ["dom", "dom.iterable", "esnext"],
    "allowJs": true,
    "skipLibCheck": true,
    "strict": true,
    "noEmit": true,
    "esModuleInterop": true,
    "module": "esnext",
    "moduleResolution": "bundler",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "jsx": "preserve",
    "incremental": true,
    "plugins": [
      {
        "name": "next"
      }
    ],
    "paths": {
      "@/*": ["./*"]
    }
  },
  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
  "exclude": ["node_modules", ".amplify", "./amplify"]
}

2. amplify/tsconfig.json
{
  "compilerOptions": {
    "target": "es2022",
    "module": "es2022",
    "moduleResolution": "bundler",
    "resolveJsonModule": true,
    "esModuleInterop": true,
    "forceConsistentCasingInFileNames": true,
    "strict": true,
    "skipLibCheck": true,
    "paths": {
      "$amplify/*": [
        "../.amplify/generated/*"
      ]
    }
  }
}

Is it expected that there must be 2 tsconfig.json files? Should I include the exclude section in the tsconfig.json file within amplify folder?

ykethan commented 2 months ago

@vinothj-aa yes your project expected have 2 tsconfig.json files. Add the "amplify/**/*" to the ./tsconfig.json exclude. thank you for posting the amplify/tsconfig.json as well, the file appears to be correct.

vinothj-aa commented 2 months ago

As per your suggestion, I updated ./tsconfig.json file with the following code

{
  "compilerOptions": {
    "target": "es2017",
    "lib": ["dom", "dom.iterable", "esnext"],
    "allowJs": true,
    "skipLibCheck": true,
    "strict": true,
    "noEmit": true,
    "esModuleInterop": true,
    "module": "esnext",
    "moduleResolution": "bundler",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "jsx": "preserve",
    "incremental": true,
    "plugins": [
      {
        "name": "next"
      }
    ],
    "paths": {
      "@/*": ["./*"]
    }
  },
  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
  "exclude": ["node_modules", ".amplify", "amplify", "amplify/**/*"]
}

It detects the file changed and it ran successfully but when I exit the sandbox and start it again (npx command), I get the same error:

.amplify/generated/env/add-user-to-group.ts(2,20): error TS2352: Conversion of type 'ProcessEnv' to type 'LambdaProvidedEnvVars & AmplifyBackendEnvVars' may be a mistake because neither type sufficiently overlaps with the other. If this was intentional, convert the expression to 'unknown' first.
  Type 'ProcessEnv' is missing the following properties from type 'LambdaProvidedEnvVars': _HANDLER, _X_AMZN_TRACE_ID, AWS_DEFAULT_REGION, AWS_REGION, and 20 more.
TypeScript validation check failed.
Resolution: Fix the syntax and type errors in your backend definition.
ykethan commented 2 months ago

@vinothj-aa remove ".amplify", "amplify",. you should only need "exclude": ["node_modules", "amplify/**/*"]

vinothj-aa commented 2 months ago

Oh! Ok.

I changed it to:

"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
"exclude": ["node_modules", "amplify/**/*"]

I get the same error. I'm suspecting that something else could be wrong here. It is because that this error occured out of nowhere, all of a sudden without making any changes to tsconfig.json files.

vinothj-aa commented 2 months ago

Do you think that I should delete the entire sandbox environment (again) and try one more time?

vinothj-aa commented 2 months ago

I pushed the changes just to check Amplify deployment and it fails with the same error:

image

Any help to resolve this issue would be highly appreciated!

ykethan commented 2 months ago

@vinothj-aa interesting, does this still occur in sandbox? Could you deleted the .amplify/generated folder, then restart the sandbox. does this mitigate the error?

vinothj-aa commented 2 months ago

@vinothj-aa interesting, does this still occur in sandbox? Could you deleted the .amplify/generated folder, then restart the sandbox. does this mitigate the error?

Yes, I tried it now but still the same error. Should I get rid of the cache folder and try again?

ykethan commented 2 months ago

@vinothj-aa would you be open for a quick chat to dive into the project. I am available on discord, my handle is ykethan.

ykethan commented 2 months ago

Thank you for hopping on a call. Marking as bug for further investigation.

ykethan commented 2 months ago

@vinothj-aa on a bit of investigation and diving into the project. Noticed the amplify/data/queries/get-region-business-unit.ts contained a unused import import next from "next";. On removing this import and re-starting sandbox the error does not appear. Could you try removing the import and let us know if this mitigates the issue.

vinothj-aa commented 2 months ago

Thanks for your response and I apologise for the delayed reply. I checked it and the resolution shared by you fixed the issue as well. But the error is misleading and pointing to a different file. Thanks for your help.

vinothj-aa commented 2 months ago

An update: When I deploy to Amplify with the above changes working locally, the build failed with the following details:

./components/admin/FacUserForm.tsx
345
97:35 Error: Regex literals are not supported. @aws-appsync/no-regex
346
124:35 Error: Regex literals are not supported. @aws-appsync/no-regex
347
169:52 Error: Regex literals are not supported. @aws-appsync/no-regex
348
203:35 Error: Regex literals are not supported. @aws-appsync/no-regex
349
./components/admin/RBUDetailsForm.tsx
350
32:20 Error: Async functions are not supported. @aws-appsync/no-async
351
34:5 Error: Try statements are not supported. @aws-appsync/no-try
352
56:6 Warning: React Hook useEffect has missing dependencies: 'fetchRBU', 'name', and 'searchParams'. Either include them or remove the dependency array. react-hooks/exhaustive-deps
353
./components/admin/RBUTable.tsx
354
49:21 Error: Async functions are not supported. @aws-appsync/no-async
355
53:5 Error: Try statements are not supported. @aws-appsync/no-try
356
54:22 Error: The `await` keyword is not supported @aws-appsync/no-await
357
73:6 Warning: React Hook useEffect has a missing dependency: 'fetchData'. Either include it or remove the dependency array. react-hooks/exhaustive-deps
358
./components/onboarding/AcLocationForm.tsx
359
49:34 Error: Async functions are not supported. @aws-appsync/no-async
360
53:22 Error: The `await` keyword is not supported @aws-appsync/no-await
361
./components/shared/MobileNumber.tsx
362
18:35 Error: Regex literals are not supported. @aws-appsync/no-regex
363
info - Need to disable some ESLint rules? Learn more here: https://nextjs.org/docs/basic-features/eslint#disabling-rules
364
2024-08-24T02:35:54.773Z [INFO]: Command exited with exit code 1: /codebuild/output/src2674548865/src/quasr-plus/node_modules/.bin/next build
365
2024-08-24T02:35:54.787Z [ERROR]: !!! Build failed
366
2024-08-24T02:35:54.788Z [INFO]: Please read more about Amplify Hosting's support for SSR frameworks to find if your build failure is related to an unsupported feature: https://docs.aws.amazon.com/amplify/latest/userguide/amplify-ssr-framework-support.html. You may also find this troubleshooting guide useful: https://docs.aws.amazon.com/amplify/latest/userguide/troubleshooting-ssr-deployment.html
367
2024-08-24T02:35:54.788Z [ERROR]: !!! Error: Command failed with exit code 1
368
2024-08-24T02:35:54.788Z [INFO]: # Starting environment caching...
369
2024-08-24T02:35:54.788Z [INFO]: # Environment caching completed
370

Looks like the inclusion of "plugin:@aws-appsync/base" in .eslintrc file is causing this issue. I know it is not required to include it but will I miss anything critical during the development phase if I remove it?