LeviN094 commented 4 months ago

Have a nice day.

NOTE

I have changed the Adapter to: import "@shopify/shopify-app-remix/adapters/vercel";
Changed the database from SQLite to PostgreSQL.
Environment variables on Vercel:
- SHOPIFY_API_KEY
- SHOPIFY_WISHLIST_ICON_ID
- SHOPIFY_API_SECRET
- POSTGRES_URL
- POSTGRES_PRISMA_URL
- POSTGRES_URL_NO_SSL
- POSTGRES_URL_NON_POOLING
- POSTGRES_USER
- POSTGRES_HOST
- POSTGRES_PASSWORD
- POSTGRES_DATABASE

Debug logs

Error [ERR_MODULE_NOT_FOUND]: Cannot find module '/var/task/node_modules/@shopify/polaris/locales/en.json' imported from /var/task/node_modules/@shopify/shopify-app-remix/dist/esm/react/components/AppProvider/AppProvider.mjs at new NodeError (node:internal/errors:405:5) at finalizeResolution (node:internal/modules/esm/resolve:332:11) at moduleResolve (node:internal/modules/esm/resolve:1029:10) at moduleResolveWithNodePath (node:internal/modules/esm/resolve:876:12) at defaultResolve (node:internal/modules/esm/resolve:1242:79) at ModuleLoader.defaultResolve (node:internal/modules/esm/loader:404:12) at ModuleLoader.resolve (node:internal/modules/esm/loader:373:25) at ModuleLoader.getModuleJob (node:internal/modules/esm/loader:250:38) at ModuleWrap. (node:internal/modules/esm/module_job:76:39) at link (node:internal/modules/esm/module_job:75:36) { url: 'file:///var/task/node_modules/@shopify/polaris/locales/en.json', code: 'ERR_MODULE_NOT_FOUND' } Node.js process exited with exit status: 1. The logs above can help with debugging the issue. INIT_REPORT Init Duration: 386.22 ms Phase: init Status: error Error Type: Runtime.ExitError Error [ERR_MODULE_NOT_FOUND]: Cannot find module '/var/task/node_modules/@shopify/polaris/locales/en.json' imported from /var/task/node_modules/@shopify/shopify-app-remix/dist/esm/react/components/AppProvider/AppProvider.mjs at new NodeError (node:internal/errors:405:5) at finalizeResolution (node:internal/modules/esm/resolve:332:11) at moduleResolve (node:internal/modules/esm/resolve:1029:10) at moduleResolveWithNodePath (node:internal/modules/esm/resolve:876:12) at defaultResolve (node:internal/modules/esm/resolve:1242:79) at ModuleLoader.defaultResolve (node:internal/modules/esm/loader:404:12) at ModuleLoader.resolve (node:internal/modules/esm/loader:373:25) at ModuleLoader.getModuleJob (node:internal/modules/esm/loader:250:38) at ModuleWrap. (node:internal/modules/esm/module_job:76:39) at link (node:internal/modules/esm/module_job:75:36) { url: 'file:///var/task/node_modules/@shopify/polaris/locales/en.json', code: 'ERR_MODULE_NOT_FOUND' } Node.js process exited with exit status: 1. The logs above can help with debugging the issue. INIT_REPORT Init Duration: 476.74 ms Phase: invoke Status: error Error Type: Runtime.ExitError Unknown application error occurred

cleverlight commented 4 months ago

I have the exact same issue. I have confirmed that the contents of en.json are being built (using remix vite:build) into the output.

Locally

client /build/client/assets/AppProxyProvider-XXXX.js
server /build/server/nodejs-XXXX/assets/index.js

On Vercel.com (Deployment > Source > Output tab)

client /assets/AppProxyProvider
can't check server because UI reports 'Cannot preview Serverless Functions'

cleverlight commented 4 months ago

Process to replicate issue

shopify app init or shopify app init --package-manager=pnpm
Change shopify.server.ts as instructed in README.md
```
// shopify.server.ts
```
import "@shopify/shopify-app-remix/adapters/node";
import "@shopify/shopify-app-remix/adapters/vercel";
Upload repo to Vercel
Look at failed deployment's logs

Error [ERR_MODULE_NOT_FOUND]: Cannot find module '/var/task/nodejs/simplest-replication/node_modules/@shopify/polaris/locales/en.json' imported from /var/task/nodejs/simplest-replication/node_modules/.pnpm/@shopify+shopify-app-remix@2.8.2_@remix-run+node@2.9.1_@remix-run+react@2.9.1_@shopify+polari_ry6l4fmsukwl5u35magougpts4/node_modules/@shopify/shopify-app-remix/dist/esm/react/components/AppProvider/AppProvider.mjs
at new NodeError (node:internal/errors:405:5)
at finalizeResolution (node:internal/modules/esm/resolve:332:11)
at moduleResolve (node:internal/modules/esm/resolve:1029:10)
at moduleResolveWithNodePath (node:internal/modules/esm/resolve:876:12)
at defaultResolve (node:internal/modules/esm/resolve:1242:79)
at ModuleLoader.defaultResolve (node:internal/modules/esm/loader:404:12)
at ModuleLoader.resolve (node:internal/modules/esm/loader:373:25)
at ModuleLoader.getModuleJob (node:internal/modules/esm/loader:250:38)
at ModuleWrap.<anonymous> (node:internal/modules/esm/module_job:76:39)
at link (node:internal/modules/esm/module_job:75:36) {
url: 'file:///var/task/nodejs/simplest-replication/node_modules/@shopify/polaris/locales/en.json',
code: 'ERR_MODULE_NOT_FOUND'
}
Node.js process exited with exit status: 1. The logs above can help with debugging the issue.
INIT_REPORT Init Duration: 370.84 ms    Phase: invoke   Status: error   Error Type: Runtime.ExitError
Unknown application error occurred

lizkenyon commented 4 months ago

Hi there 👋

Could @cleverlight and @LeviN094 both confirm what versions of the the shopify packages you are using?

LeviN094 commented 4 months ago

Yes, I was using the latest package at the time I deployed the project. Please check the packages in my package.json file.

"dependencies": { "@prisma/client": "^5.8.0", "@remix-run/dev": "^2.7.1", "@remix-run/node": "^2.7.1", "@remix-run/react": "^2.7.1", "@remix-run/serve": "^2.7.1", "@shopify/app": "3.58.2", "@shopify/cli": "3.58.2", "@shopify/polaris": "^12.0.0", "@shopify/shopify-api": "^9.2.0", "@shopify/shopify-app-remix": "^2.5.0", "@shopify/shopify-app-session-storage-prisma": "^4.0.1", "date-fns": "^3.6.0", "isbot": "^5.1.0", "prisma": "^5.8.0", "react": "^18.2.0", "react-dom": "^18.2.0", "remix-utils": "^7.6.0", "vite-tsconfig-paths": "^4.3.1" }

cleverlight commented 4 months ago

Hi @lizkenyon , 👋 thanks for getting involved.

Process to replicate issue

I just ran shopify app init or shopify app init --package-manager=pnpm at the time of the post yesterday. I'm guessing the CLI is using the main branch. I have just seen @paulomarg 's commit (thank you) so I thought I'd verify that my test included that.

@LeviN094 version

"@shopify/shopify-app-remix": "^2.5.0",

My yesterday version

"@shopify/shopify-app-remix": "^2.8.2",

My today version

"@shopify/shopify-app-remix": "^2.8.2",

I tested the latest version this morning in Vercel. The bug is still as reported:

Error [ERR_MODULE_NOT_FOUND]: Cannot find module '/var/task/nodejs/latest27-4/node_modules/@shopify/polaris/locales/en.json' imported from /var/task/nodejs/latest27-4/node_modules/.pnpm/@shopify+shopify-app-remix@2.8.2_@remix-run+node@2.9.1_@remix-run+react@2.9.1_@shopify+polari_bibpozdhwsghuwk6grm3vah5ey/node_modules/@shopify/shopify-app-remix/dist/esm/react/components/AppProvider/AppProvider.mjs
    at new NodeError (node:internal/errors:405:5)
    at finalizeResolution (node:internal/modules/esm/resolve:332:11)
    at moduleResolve (node:internal/modules/esm/resolve:1029:10)
    at moduleResolveWithNodePath (node:internal/modules/esm/resolve:876:12)
    at defaultResolve (node:internal/modules/esm/resolve:1242:79)
    at ModuleLoader.defaultResolve (node:internal/modules/esm/loader:404:12)
    at ModuleLoader.resolve (node:internal/modules/esm/loader:373:25)
    at ModuleLoader.getModuleJob (node:internal/modules/esm/loader:250:38)
    at ModuleWrap.<anonymous> (node:internal/modules/esm/module_job:76:39)
    at link (node:internal/modules/esm/module_job:75:36) {
  url: 'file:///var/task/nodejs/latest27-4/node_modules/@shopify/polaris/locales/en.json',
  code: 'ERR_MODULE_NOT_FOUND'
}
INIT_REPORT Init Duration: 426.85 ms    Phase: invoke   Status: error   Error Type: Runtime.ExitError
Error: Runtime exited with error: exit status 1

I also spotted that the versions are in the error output, which is how I verified this morning which versions I've tested:

Mine today: /@shopify+shopify-app-remix@2.8.2 @remix-run+node@... Mine yesterday: @shopify+shopify-app-remix@2.8.2 @remix-run+node@...

After spending all day yesterday researching this, I wondered if this SvelteJS issue for their Vercel adapter might help?

paulomarg commented 4 months ago

Thanks for the extra details folks, I'm adding this to our tracking and we'll look into it!

lnehlsen commented 4 months ago

I'm running into the exact same issue again. The Shopify App was working at the 2nd of april and after redeployment at the end of april I've got the same error with the exact same code. I also changed the versions in the package.json to some older ones but still facing the same issue.

This is my troubleshooting so far, but none of it worked:

Affected files and lines removed and imported file locally
Set up a new Vercel project
Updated codebase to the newest version that shopify has in their Github (23 april)
Removed ^ from package.json for remix
Tested official Vercel Vite packages
Deployed old commit from April 2nd
Manually entered deploy commands in vercel
Switched back to old Vercel CLI version from 2nd april
Build Vercel with Vite template or manual

LeviN094 commented 4 months ago

@lnehlsen Thanks for the information. Hopefully, we can resolve this issue soon.

bijanv commented 4 months ago

Also running into this issue, looking forward to a resolution soon 🙏

kcrebound commented 4 months ago

got same issue, any workaround for it?

alesiooooooo commented 4 months ago

got same issue, any workaround for it?

the same problem, I tried all combinations, but shopify/polaris package has 'json modules requires assert type json'

Nedomas commented 4 months ago

Blocked by this also - new Vercel deploys succeed but functions crash in prod because of this. Started when updated to @shopify/polaris@13.3.0 from 13.0.0.

Wonder if related to package-json.lock not being in source control by default in this repo and maybe some random subdependency just got updated.

Any other ideas what we could test?

Stacktrace:

Error [ERR_MODULE_NOT_FOUND]: Cannot find module '/var/task/node_modules/@shopify/polaris/locales/en.json' imported from /var/task/node_modules/@shopify/shopify-app-remix/dist/esm/react/components/AppProvider/AppProvider.mjs
at finalizeResolution (node:internal/modules/esm/resolve:269:11)
at moduleResolve (node:internal/modules/esm/resolve:937:10)
at moduleResolveWithNodePath (node:internal/modules/esm/resolve:1161:14)
at defaultResolve (node:internal/modules/esm/resolve:1204:79)
at ModuleLoader.defaultResolve (node:internal/modules/esm/loader:390:12)
at ModuleLoader.resolve (node:internal/modules/esm/loader:359:25)
at ModuleLoader.getModuleJob (node:internal/modules/esm/loader:234:38)
at ModuleWrap.<anonymous> (node:internal/modules/esm/module_job:87:39)
at link (node:internal/modules/esm/module_job:86:36) {
code: 'ERR_MODULE_NOT_FOUND',
url: 'file:///var/task/node_modules/@shopify/polaris/locales/en.json'
}
Node.js process exited with exit status: 1. The logs above can help with debugging the issue.
INIT_REPORT Init Duration: 555.63 ms    Phase: init Status: error   Error Type: Runtime.ExitError
Error [ERR_MODULE_NOT_FOUND]: Cannot find module '/var/task/node_modules/@shopify/polaris/locales/en.json' imported from /var/task/node_modules/@shopify/shopify-app-remix/dist/esm/react/components/AppProvider/AppProvider.mjs
at finalizeResolution (node:internal/modules/esm/resolve:269:11)
at moduleResolve (node:internal/modules/esm/resolve:937:10)
at moduleResolveWithNodePath (node:internal/modules/esm/resolve:1161:14)
at defaultResolve (node:internal/modules/esm/resolve:1204:79)
at ModuleLoader.defaultResolve (node:internal/modules/esm/loader:390:12)
at ModuleLoader.resolve (node:internal/modules/esm/loader:359:25)
at ModuleLoader.getModuleJob (node:internal/modules/esm/loader:234:38)
at ModuleWrap.<anonymous> (node:internal/modules/esm/module_job:87:39)
at link (node:internal/modules/esm/module_job:86:36) {
code: 'ERR_MODULE_NOT_FOUND',
url: 'file:///var/task/node_modules/@shopify/polaris/locales/en.json'
}
Node.js process exited with exit status: 1. The logs above can help with debugging the issue.
INIT_REPORT Init Duration: 914.22 ms    Phase: invoke   Status: error   Error Type: Runtime.ExitError
Unknown application error occurred

lizkenyon commented 4 months ago

Hey folks 👋

After some investigation we believe we have determined what version of the packages seem to be causing this error.

For your application to work we recommend pinning the packages to the following versions.

    "@shopify/shopify-api": "9.7.2",
    "@shopify/shopify-app-remix": "2.8.0",
    "@shopify/shopify-app-session-storage-prisma": "4.0.4",

In shopify-app-remix v2.8.1 we started using ESM with an import assertion for the @shopify/polaris/locales/en.json . It appears that the Vercel build does not handle this correctly, and then is not including this file in the build when it should. (You can test this by running vercel build locally, and looking in the .vercel/output/functions/app.func/.vc-config.json)

We are going to reach out to Vercel to get more information from them about this. But in the mean time we would recommend using the above package versions.

It does appear Vercel does some caching in their build process, ensure your are rebuilding without the build cache when deploying these changes.

LeviN094 commented 4 months ago

Thank you for your hard work @lizkenyon. My project is working well after updating the version in package.json. I hope the issue will work in the latest versions.

Best regards

lizkenyon commented 4 months ago

Hi folks 👋

It looks like Vercel has fixed this on their side in the latest version. Please give this a try to see if it resolved the issue. 🙂

cleverlight commented 4 months ago

Hi @lizkenyon

Alas not working for me. I did a fresh build this morning using Shopfy CLI (@shopify/cli/3.60.1 linux-x64 node-v18.17.1). I changed shopify.server.ts as described in the README.md:

// shopify.server.ts
- import "@shopify/shopify-app-remix/adapters/node";
+ import "@shopify/shopify-app-remix/adapters/vercel";

I deployed that to Vercel as latest15-5 project. Once deployed, I got the same error I've been seeing in the logs:

Error [ERR_MODULE_NOT_FOUND]: Cannot find module '/var/task/nodejs/latest15-5/node_modules/@shopify/polaris/locales/en.json' imported from /var/task/nodejs/latest15-5/node_modules/.pnpm/@shopify+shopify-app-remix@2.8.2_@remix-run+node@2.9.2_@remix-run+react@2.9.2_@shopify+polari_sqgc7of7lid5n2hqfm2oigaasq/node_modules/@shopify/shopify-app-remix/dist/esm/react/components/AppProvider/AppProvider.mjs
at finalizeResolution (node:internal/modules/esm/resolve:269:11)
at moduleResolve (node:internal/modules/esm/resolve:937:10)
at moduleResolveWithNodePath (node:internal/modules/esm/resolve:1161:14)
at defaultResolve (node:internal/modules/esm/resolve:1204:79)
at ModuleLoader.defaultResolve (node:internal/modules/esm/loader:390:12)
at ModuleLoader.resolve (node:internal/modules/esm/loader:359:25)
at ModuleLoader.getModuleJob (node:internal/modules/esm/loader:234:38)
at ModuleWrap.<anonymous> (node:internal/modules/esm/module_job:87:39)
at link (node:internal/modules/esm/module_job:86:36) {
code: 'ERR_MODULE_NOT_FOUND',
url: 'file:///var/task/nodejs/latest15-5/node_modules/@shopify/polaris/locales/en.json'
}
Node.js process exited with exit status: 1. The logs above can help with debugging the issue.
INIT_REPORT Init Duration: 524.84 ms    Phase: invoke   Status: error   Error Type: Runtime.ExitError

Please accept my apologies if I've missed something when giving this a try. Could you verify that you've followed the same process and got a different result please?

nickfthedev commented 4 months ago

Not working for me. Used the version numbers from above and deployed on vercel but the error persists:

Error [ERR_MODULE_NOT_FOUND]: Cannot find module '/var/task/node_modules/@shopify/polaris/locales/en.json' imported from /var/task/node_modules/@shopify/shopify-app-remix/dist/esm/react/components/AppProvider/AppProvider.mjs at finalizeResolution (node:internal/modules/esm/resolve:269:11) at moduleResolve (node:internal/modules/esm/resolve:937:10) at moduleResolveWithNodePath (node:internal/modules/esm/resolve:1161:14) at defaultResolve (node:internal/modules/esm/resolve:1204:79) at ModuleLoader.defaultResolve (node:internal/modules/esm/loader:390:12) at ModuleLoader.resolve (node:internal/modules/esm/loader:359:25) at ModuleLoader.getModuleJob (node:internal/modules/esm/loader:234:38) at ModuleWrap.<anonymous> (node:internal/modules/esm/module_job:87:39) at link (node:internal/modules/esm/module_job:86:36) { code: 'ERR_MODULE_NOT_FOUND', url: 'file:///var/task/node_modules/@shopify/polaris/locales/en.json' } Node.js process exited with exit status: 1. The logs above can help with debugging the issue. INIT_REPORT Init Duration: 220.67 ms Phase: invoke Status: error Error Type: Runtime.ExitError

lizkenyon commented 4 months ago

Hi there 👋

I was able to successfully get this to deploy using "@shopify/shopify-app-remix": "2.8.1", on Vercel. 🎉

You need to ensure you are using the latest version of the Vercel CLI. Vercel CLI 34.1.14 is the version where they fixed this issue. To ensure this, I specified the specific Vercel CLI version the in environment variables for my project. VERCEL_CLI_VERSION = vercel@34.1.14

You can then verify in your deployment logs that the correct version is being used.

You can test this locally by

npm i -g vercel@latest vercel --version (check for 34.1.14) vercel build

Check that you see node_modules/@shopify/polaris/locales/en.json in .vercel/output/functions/app.func/.vc-config.json

nickfthedev commented 4 months ago

Hi there 👋

I was able to successfully get this to deploy using "@shopify/shopify-app-remix": "2.8.1", on Vercel. 🎉

You need to ensure you are using the latest version of the Vercel CLI. Vercel CLI 34.1.14 is the version where they fixed this issue. To ensure this, I specified the specific Vercel CLI version the in environment variables for my project. VERCEL_CLI_VERSION = vercel@34.1.14

You can then verify in your deployment logs that the correct version is being used.

You can test this locally by

npm i -g vercel@latest vercel --version (check for 34.1.14) vercel build

Check that you see node_modules/@shopify/polaris/locales/en.json in .vercel/output/functions/app.func/.vc-config.json

This works! I didn't set the VERCEL_CLI_VERSION = vercel@34.1.14 as an enviroment variable. Thank you!

lizkenyon commented 4 months ago

Glad it worked!

As it states in the deployment logs, using the env variable to set the Vercel CLI version would stop you from getting updates in the future, so you shouldn't keep this set forever.

I would suggest heading over to the Vercel docs for further details on updating the Vercel CLI, and updating your deployment processes.

cleverlight commented 4 months ago

Thank you for all your help on this so far @lizkenyon, but please don't close this ticket. I don't believe it's fixed. The current version installed by the current CLI is 2.8.2 ("@shopify/shopify-app-remix": "^2.8.2"), which does not work.

Thank you for coming up with a short-term hack, where we can revert to earlier version of shopify-app-remix, but future users following the README.md will be faced with the same problem. Either the shopify-cli needs updating so that it does not install 2.8.2, or better, we need to fix forward:

Nowhere in the README.md does it suggest that the vercel package needs to be installed.
The vercel package is not included in the package.json generated by shopify app init
There's no mention in the README.md that the Vercel CLI needs to be used to deploy to vercel. Many people will have set up their GitHub repo in the Vercel.com UI and deploy using a git push.

While I'm delighted that there's signs of a solution here, especially for those who are already running in production, I feel like it's really valuable to fix the root of the problem, or at least something close to that (shopify-cli, or the README.md instrutions).

I think the first step is to update the Process to replicate issue on this ticket. Please could you clarify exactly what you did to make it work?

Original process to replicate issue

shopify app init or shopify app init --package-manager=pnpm
Change shopify.server.ts as instructed in README.md
```
// shopify.server.ts
```
import "@shopify/shopify-app-remix/adapters/node";
import "@shopify/shopify-app-remix/adapters/vercel";
Upload repo to Vercel
Look at failed deployment's logs

Additional steps??

modify package.json to "@shopify/shopify-app-remix": "2.8.1"
re-run pnpm install
set VERCEL_CLI_VERSION = vercel@34.1.14 environment variable in .env
to test locally:
- npm i -g vercel@latest
- vercel --version (check for 34.1.14)
- vercel build
push live

lizkenyon commented 4 months ago

Hi there @cleverlight

Unfortunately I am not able to replicate your issue with "@shopify/shopify-app-remix": "^2.8.2". This successfully deploys for me.

Nowhere in the README.md does it suggest that the vercel package needs to be installed. The vercel package is not included in the package.json generated by shopify app init

We do not currently provide detailed instructions for every deployment platform. We are looking to provide more instructions in the future. Right now you should be able to find instructions for deploying Remix apps on Vercel in Vercel's documentation.

There's no mention in the README.md that the Vercel CLI needs to be used to deploy to vercel. Many people will have set up their GitHub repo in the Vercel.com UI and deploy using a git push.

You do not need the Vercel CLI to deploy to Vercel! Using a github repo and git push is the way I am doing it as well! Though the Vercel UI will be using the Vercel CLI to build (Take a look at your build logs in the Vercel UI). You don't need to have the Vercel CLI locally. I am using this to test that my project is building correctly, as that is a quicker feedback loop then by pushing my code to Vercel and building there.

And to be clear the root of the problem here was that Vercel was not supporting a feature of javascript that they should have been. And therefore it was incorrectly building the project. In their latest release they now support this! 🎉 This is why it is important to make sure you are using the latest version of the Vercel CLI in your build. (You can force the version of the Vercel CLI by setting the env variable in your Vercel project)

If have more questions about deploying Remix apps to Vercel, I would encourage you to reach out to Vercel, as they are the experts on this!

cleverlight commented 4 months ago

Hi @lizkenyon,

You need to ensure you are using the latest version of the Vercel CLI.

I understand now that this applies to the implicit Vercel CLI, which is used by Vercel during an automated build. That also clarifies where you're setting the environment variable and its role.

We do not currently provide detailed instructions for every deployment platform.

I understand and respect your position. There is a section in this repo's README.md that's called "Hosting on Vercel", so I think that my misunderstanding the scope of what you are providing is also understandable.

Shopify / shopify-app-template-remix

Error: 500: "INTERNAL_SERVER_ERROR - This Serverless Function has crashed" during deployment to Vercel host #689

NOTE

Debug logs

Locally

On Vercel.com (Deployment > Source > Output tab)

Process to replicate issue

@LeviN094 version

My yesterday version

My today version

Original process to replicate issue

Additional steps??