Remix + Architect: State of the Integration

Taylor Beseda’s avatar

by Taylor Beseda
@tbeseda
on

Updated on March 14, 2022

A new Architect plugin has been released. If you’re using Remix with Architect, we think it’s also worth checking out. Read our blog post here.

Updated on February 28, 2022

The Remix team released v1.2.3 of their @remix-run/architect package which picks up the latest @architect/function. This resolves the issue described below 👇.

Architect and Remix

2 ships passing in the night. Remix is rad, and Architect is powerful. ​

  • Remix has a great adapter for Architect: @remix-run/architect
  • Architect recently released v10
  • We’re working on an Architect plugin for Remix ​

The issue

tl;dr: @remix-run/architect uses @architect/function@4. @architect/architect@10 requires @architect/functions@5. ​ Based on Arc’s previous recommendation, Remix instructions for using Architect ask the user to install arc globally. As of Monday, Feb. 21, this would install Arc v10. But this causes an issue when running Architect’s AWS emulator: Sandbox (via arc sandbox) in a project that uses Remix’s Architect adapter. Sandbox complains that @architect/functions is outdated and halts. Oh no! ​

Solution

The good news: these packages are compatible! Remix has changed their adapter to use the latest Architect functions package. Make sure you install v1.2.3 or later of @remix-run/architect. ​ Architect is moving away from the global install recommendation (although, global arc usage will continue to be supported). ​

Current Recommendation

Use Architect v9.5.4 as a project dependency in your Remix + Architect application. ​

npm i -D @architect/architect@9

​ Optionally, remove the global arc: ​

npm uninstall -g @architect/architect

​ Run arc from inside your project’s root with npx: ​

npx arc sandbox

“But I really, really want to use Arc 10”

​​ So you’d like to stay on the cutting edge? I feel that. If you are using npm v8.3.x+, you can try using an overrides entry in your Remix server’s handler’s package.json and tell npm to use @architect/functions 5.0.2 in @remix-run/architect. ​ This entry should be in the server’s package.json and therefore should also declare all dependencies of the server since that Lambda will not benefit from Architect’s automatic analysis and hydration. ​ If you’re new to Arc, this approach may require additional reading on Architect. ​

Other issues

Remix’s live reload doesn’t always work in a predictable way when running alongside Architect Sandbox. Users may see an error in the browser’s console. Relates to NODE_ENV=development. ​ @remix-run/architect had a peer dependency of @architect/architect@8. This has been removed in the next release. ​

The Future of Remix on Architect

Both teams are working on their products with an eye to how they interact in the future. Architect 10 enables a powerful plugin API, and we’ve already started on a first-class plugin for Remix — currently in an alpha testing stage. It comes at the integration from a different angle, and we fully expect it will exist alongside Remix’s recommended approach to integrating with Arc. We plan to release the plugin in March.

Join the Architect and Remix Discords to keep up to date with latest developments.