wingleung / remix-aws

AWS adapter for Remix
https://www.npmjs.com/package/remix-aws
MIT License
21 stars 6 forks source link

HOWTO: Usage with remix vite plugin #8

Open MattyBalaam opened 4 months ago

MattyBalaam commented 4 months ago

Is this project compatible with the new vite config, and how can it be migrated?

MattyBalaam commented 4 months ago

I have worked out that yes it will work.

In our particular use case we were running our app using NodejsFunctionfrom aws-cdk-lib/aws-lambda-nodejs and we were using the server entrypoint option in our remix.config file to point to our server.ts file which exports a handler function created by remix-aws like this:

import * as build from '@remix-run/dev/server-build';

export const handler = createRequestHandler({
  build,
  mode: process.env.NODE_ENV,
  awsProxy: AWSProxy.APIGatewayV1,
});

We then pointed our NodejsFunction to the output of the remix build.

However, we have now flipped this around. Insteead we let remix build, and then we import the build path into our server.ts file:

export const handler = createRequestHandler({
  // @ts-expect-error this may not exist at all times so will throw an error - awaiting help from remix team
  build: await import('./build/server/index.js'),
  mode: process.env.NODE_ENV,
  awsProxy: AWSProxy.APIGatewayV1,
});

And then finallay in our NodejsFunction we point directly at the server.ts file (instead of the build output)

wingleung commented 3 months ago

great to see you making it work in cdk! 👏

The extra build step that is needed after the remix build might not always be optimal in every use case.

I think we need to check the vite presets and create a awsPreset() for the vite config to add the aws adapters in the vite build. That way there is no need for an extra file to add our aws adapters, it's al configured within the vite build and the outputted server build is the actual file where the handler is.

The Remix Vite plugin supports a presets option to ease integration with other tools and hosting providers.

👉 https://remix.run/docs/en/main/future/presets

I'll take another look later, I couldn't see how we can add the adapters within the vite config except in the buildEnd but that would mean that I need to do another build after remix' build 🤔 which would not be want we want.

MattyBalaam commented 3 months ago

I had a hunch a vite plugin would probably be the most optimal solution, but time was not on my side to learn how to do it, looking forward to seeing what you come up with.

wingleung commented 2 months ago

Added a vite preset in #14

I didn't find a way of hooking into the vite build, the only way I found was to automate the creation of server.js and add a buildEnd function that will do an extra build after the remix build. The post build will then overwrite the remix server build in build/server/index.js.

You can also opt out of overwriting the remix build or opt out of the default server.js by providing your own server.js via the build.entryPoints config.