feat(remix-dev): set handle from frontmatter in MDX files

Fixes #4864.

docs/guides/mdx.md

@@ -67,7 +67,7 @@ You can reference your frontmatter data through "attributes". The title of this
 
 ### Advanced Example
 
-You can even export all the other things in this module that you can in regular route modules in your mdx files like `loader` and `action`:
+You can even export all the other things in this module that you can in regular route modules in your mdx files like `loader`, `action`, and `handle`:
 
 ```mdx
 ---
@@ -77,6 +77,9 @@ meta:
 
 headers:
   Cache-Control: no-cache
+
+handle:
+  someData: abc
 ---
 
 import styles from "./first-post.css";
@@ -85,10 +88,6 @@ export const links = () => [
   { rel: "stylesheet", href: styles },
 ];
 
-export const handle = {
-  someData: "abc",
-};
-
 import { json } from "@remix-run/node";
 import { useLoaderData } from "@remix-run/react";
 

integration/mdx-test.ts

@@ -55,6 +55,8 @@ test.describe("mdx", () => {
 meta:
   title: My First Post
   description: Isn't this awesome?
+handle:
+  someData: abc
 headers:
   Cache-Control: no-cache
 ---
@@ -63,10 +65,6 @@ export const links = () => [
   { rel: "stylesheet", href: "app.css" }
 ]
 
-export const handle = {
-  someData: "abc"
-}
-
 import { useLoaderData } from '@remix-run/react';
 
 export const loader = async () => {

packages/remix-dev/compiler/plugins/mdx.ts

@@ -72,6 +72,7 @@ export function mdxPlugin(config: RemixConfig): esbuild.Plugin {
 export const filename = ${JSON.stringify(path.basename(args.path))};
 export const headers = typeof attributes !== "undefined" && attributes.headers;
 export const meta = typeof attributes !== "undefined" && attributes.meta;
+export const handle = typeof attributes !== "undefined" && attributes.handle;
           `;
 
           let compiled = await xdm.compile(fileContents, {