adds Cannot find module $amplify/env/<function-name> troubleshooting doc (#7681)

* adds cannot find module troubleshooting doc

* update name

* nit update function

* nit update function

* Update src/pages/[platform]/build-a-backend/troubleshooting/cannot-find-module-amplify-env/index.mdx

---------

Co-authored-by: josef <josef.aidt@gmail.com>

Author: ykethan

src/directory/directory.mjs

@@ -672,6 +672,9 @@ export const directory = {
                 },
                 {
                   path: 'src/pages/[platform]/build-a-backend/troubleshooting/stack-cdktoolkit-already-exists/index.mdx'
+                },
+                {
+                  path: 'src/pages/[platform]/build-a-backend/troubleshooting/cannot-find-module-amplify-env/index.mdx'
                 }
               ]
             }

src/pages/[platform]/build-a-backend/troubleshooting/cannot-find-module-amplify-env/index.mdx

@@ -0,0 +1,51 @@
+import { getCustomStaticPath } from '@/utils/getCustomStaticPath';
+
+export const meta = {
+  title: 'Troubleshoot "Cannot find module $amplify/env/<function-name>"',
+  description: 'Addressing "Cannot find module $amplify/env/<function-name>" error message',
+  platforms: [
+    'angular',
+    'javascript',
+    'nextjs',
+    'react',
+    'react-native',
+    'vue'
+  ]
+};
+
+export function getStaticPaths() {
+  return getCustomStaticPath(meta.platforms);
+}
+
+export function getStaticProps(context) {
+  return {
+    props: {
+      meta
+    }
+  };
+}
+
+When deploying a Amplify Gen 2 app, you may encounter the error message `Cannot find module $amplify/env/<function-name>` in your frontend build on Amplify Console. This error occurs when your framework `tsconfig.json` configuration picks up the `amplify` directory and tries to resolve it as a module. This module is a placeholder for environment variables that are injected at build time by Amplify. To resolve this error, you need to exclude the `amplify` directory.
+
+To exclude the `amplify` directory in your `tsconfig.json`, add the following lines to the `exclude` section:
+
+```ts title='tsconfig.json'
+{
+  "exclude": ["amplify/**/*"]
+}
+```
+
+Amplify will perform type-checking on sandbox and pipeline-deploy using the tsconfig local to the Amplify backend `amplify/tsconfig.json`. If you'd like to extend your base configuration you can add it to the localized tsconfig.
+
+Alternatively, if you work within a monorepo you can move your backend to its own package and export the Schema and outputs for ease of sharing with your other apps. For example, in your backend package's `package.json`
+
+```json title='package.json'
+{
+  "name": "my-backend",
+  "private": true,
+  "exports": {
+    "./schema": "./amplify/data/resource.ts",
+    "./outputs": "./amplify_outputs.json"
+  }
+}
+```