https://github.com/pcattori/remix-byoc-example

https://github.com/pcattori/remix-byoc-example

Last synced: 2 months ago
JSON representation

• Host: GitHub
• URL: https://github.com/pcattori/remix-byoc-example
• Owner: pcattori
• Created: 2022-07-12T14:36:36.000Z (over 2 years ago)
• Default Branch: main
• Last Pushed: 2022-09-01T15:39:03.000Z (over 2 years ago)
• Last Synced: 2024-05-02T02:12:39.876Z (9 months ago)
• Language: TypeScript
• Size: 712 KB
• Stars: 4
• Watchers: 2
• Forks: 2
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Remix - Bring Your Own Compiler (BYOC)

Goal: Let users customize build (e.g via plugins) to support the features they care about that are outside the scope for Remix.

App is copied from [kentcdodds/fakebooks-remix](https://github.com/kentcdodds/fakebooks-remix).

## Build and run

```sh

npm run byoc2

npm run start

```

## Technical approach

Note: code in `./.remix/lib/` would eventually be imported from a Remix package like `@remix-run/dev` or similar.

Define compiler-agnostic function signatures for compiling the browser bundle and the server bundle:

```ts

import type { AssetsManifest } from "@remix-run/dev/compiler/assets";

import type { RemixConfig } from "@remix-run/dev/config";

/**

 * Compile the browser bundle.

 * Write compiled output to `./public/build/`

 */

export type CompileBrowser = (

  remixConfig: RemixConfig

) => Promise;

/**

 * Compile the server bundle.

 * Write compiled output to `./build/index.js`

 */

export type CompileServer = (

  remixConfig: RemixConfig,

  manifestPromise: Promise

) => Promise;

```

Then provide a `build` function that accepts implementations for compiling browser and server:

```ts

type Build = (

  remixConfig: RemixConfig,

  compile: { browser: CompileBrowser; server: CompileServer }

) => [ReturnType, ReturnType];

```

## Conventions (TBD)

```

my-remix-app/

- .remix/

  - compiler.mjs

  - config.browser.js

  - config.server.mjs

```

## TODO

- [ ] Fix live reload

- [ ] `dev`/`watch` mode

- [ ] Refactor webpack configs into a Remix webpack plugin