Issues Deploying Shopify Remix App with SST to AWS (ESM + Vite Conflict)

App Bridge
,
1

I’m building an Admin Shopify App using the Shopify Remix App Template, and I’m trying to deploy it to AWS using SST.

While everything works locally and remix vite:build completes without errors, running sst deploy throws the following error:

Error: Cannot require() ES Module /vite/dist/node/index.js in a cycle.  
Error: Could not load Vite configuration from "vite.config.js". Check that your Remix project uses Vite and the file exists.

It seems this is due to an ESM conflict in SST.

The remix vite:build command runs without issues, but during sst deploy, it appears to call remix vite:build again internally, which causes the problem when loading the Vite config.

I attempted to switch to remix build without Vite, but then encountered the following error:

✘ [ERROR] Expected ";" but found "with"

node_modules/@shopify/shopify-app-remix/dist/esm/react/components/AppProvider/AppProvider.mjs:3:59:
  3 │ ...I18n from '@shopify/polaris/locales/en.json' with { type: 'json' };

This seems to be caused by esbuild not supporting import assertions.

So here’s my question:

Is there a proper way to deploy the Shopify Remix app template to AWS?

Even when following SST’s own Remix guide, this Vite-related conflict still occurs.

Is it fundamentally impossible to deploy the Remix + Vite setup with SST?

All of my infrastructure is on AWS, so I’d like to establish a deployment process that stays within the AWS ecosystem.

For other REST APIs, I’ve been using the Serverless Framework and Lambda,

but I couldn’t find much documentation around deploying Remix apps in this context.

I’d like to know how other developers are handling deployment for this stack.

Thanks in advance.

2

Interesting, I’ve used SST in the past to deploy a Shopify Next.js app, but this is ancient history at this point.

Can you share more details like your SST deployment configuration, your package versions, and your current Node.js version?

3

A quick search through the SST github repo shows that maybe you must use a vite.config.ts file. See if that fixes things temporarily?

4

node version: 20
sst: 3.17.6
vite: 6.2.2
react: 18.2

The basic app structure and SST are set up with normal settings.

shopify app init -> select remix js app
npx sst@latest init

After running the above commands, only the AWS profile was added, but the same error occurs when running sst deploy.

/app root

  • app folder
  • remix.config.js
  • vite.config.js
  • sst.config.ts

More detail error message

build/server/.vite/manifest.json                 0.58 kB
build/server/assets/server-build-TqOIn4DE.css    0.76 kB
build/server/assets/styles-BeiPL2RV.css        444.11 kB
build/server/index.js                           53.42 kB
✓ built in 95ms. <<<<<<<<<<<<<<<<< remix vite:build done success
|  Created     MyWeb sst:aws:Remix → MyWebBuilder command:local:Command (2.6s)
failed to load config from PROJECT_ROOT/vite.config.js
|  Error       
Error: Cannot require() ES Module PROJECT_ROOT/node_modules/vite/dist/node/index.js in a cycle. (from PROJECT_ROOT/node_modules/vite-node/dist/server.cjs)
    at ModuleLoader.importSyncForRequire (node:internal/modules/esm/loader:309:15)
    at loadESMFromCJS (node:internal/modules/cjs/loader:1371:24)
    at Module._compile (node:internal/modules/cjs/loader:1511:5)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1572:16)
    at Module.load (node:internal/modules/cjs/loader:1275:32)
    at Function.Module._load (node:internal/modules/cjs/loader:1096:12)
    at Module.require (node:internal/modules/cjs/loader:1298:19)
    at require (node:internal/modules/helpers:182:18)
    at Object.<anonymous> (PROJECT_ROOT/node_modules/vite-node/dist/server.cjs:9:12)
    at Module._compile (node:internal/modules/cjs/loader:1529:14)
|  Error       
Error: Could not load Vite configuration from "vite.config.js". Check that your Remix project uses Vite and the file exists.
    at loadViteConfig (file://PROJECT_ROOT/.sst/platform/src/components/aws/remix.ts:496:19)
    at file://PROJECT_ROOT/.sst/platform/src/components/aws/remix.ts:441:28

✕  Failed

According to ChatGPT,

the issue occurs in vite.loadConfigFromFile inside .sst/platform/src/components/aws/remix.ts,

due to a require() ESM module conflict.

5

I’ve found a workaround that makes it work:

It turns out the issue was related to module loading behavior depending on the versions of Vite and SST.

By downgrading Vite and renaming vite.config.js to vite.config.ts, the deployment now works.

It seems that we’ll need to wait for an update to SST’s Remix integration for a more permanent solution.

1 Like
6

Related sst git issue.

1 Like