Merge branch 'dev' into brophdawg11/resource-route-boundary

remix-run · Apr 21, 2023 · effe39f · effe39f
2 parents 99fe8f5 + 85c3cb6
commit effe39f
Show file tree

Hide file tree

Showing 19 changed files with 77 additions and 2 deletions.
diff --git a/integration/mdx-test.ts b/integration/mdx-test.ts
@@ -5,6 +5,7 @@ import {
   createFixture,
   js,
   mdx,
+  css,
 } from "./helpers/create-fixture";
 import type { Fixture, AppFixture } from "./helpers/create-fixture";
 import { PlaywrightFixture } from "./helpers/playwright-fixture";
@@ -62,8 +63,10 @@ headers:
   Cache-Control: no-cache
 ---
 
+import stylesheetHref from "../app.css"
+
 export const links = () => [
-  { rel: "stylesheet", href: "app.css" }
+  { rel: "stylesheet", href: stylesheetHref }
 ]
 
 import { useLoaderData } from '@remix-run/react';
@@ -86,6 +89,13 @@ export function ComponentUsingData() {
         "app/routes/basic.mdx": mdx`
 # This is some basic markdown!
         `.trim(),
+
+        "app/app.css": css`
+          body {
+            background-color: #eee;
+            color: #000;
+          }
+        `,
       },
     });
     appFixture = await createAppFixture(fixture);
@@ -113,6 +123,8 @@ export function ComponentUsingData() {
     expect(await app.getHtml("title")).toMatch("My First Post");
     expect(await app.getHtml("#loader")).toMatch(/Mambo Number:.+5/s);
     expect(await app.getHtml("#handle")).toMatch("abc");
-    expect(await app.getHtml('link[rel="stylesheet"]')).toMatch("app.css");
+    expect(await app.getHtml('link[rel="stylesheet"]')).toMatch(
+      /app-[\dA-Z]+\.css/
+    );
   });
 });
diff --git a/templates/arc/app/root.tsx b/templates/arc/app/root.tsx
@@ -6,6 +6,12 @@ import {
   Scripts,
   ScrollRestoration,
 } from "@remix-run/react";
+import type { LinksFunction } from "@remix-run/node";
+import { cssBundleHref } from "@remix-run/css-bundle";
+
+export const links: LinksFunction = () => [
+  ...(cssBundleHref ? [{ rel: "stylesheet", href: cssBundleHref }] : []),
+];
 
 export default function App() {
   return (

diff --git a/templates/arc/package.json b/templates/arc/package.json
@@ -11,6 +11,7 @@
   },
   "dependencies": {
     "@remix-run/architect": "*",
+    "@remix-run/css-bundle": "*",
     "@remix-run/node": "*",
     "@remix-run/react": "*",
     "cross-env": "^7.0.3",

diff --git a/templates/cloudflare-pages/app/root.tsx b/templates/cloudflare-pages/app/root.tsx
@@ -6,6 +6,12 @@ import {
   Scripts,
   ScrollRestoration,
 } from "@remix-run/react";
+import type { LinksFunction } from "@remix-run/node";
+import { cssBundleHref } from "@remix-run/css-bundle";
+
+export const links: LinksFunction = () => [
+  ...(cssBundleHref ? [{ rel: "stylesheet", href: cssBundleHref }] : []),
+];
 
 export default function App() {
   return (

diff --git a/templates/cloudflare-pages/package.json b/templates/cloudflare-pages/package.json
@@ -13,6 +13,7 @@
   "dependencies": {
     "@remix-run/cloudflare": "*",
     "@remix-run/cloudflare-pages": "*",
+    "@remix-run/css-bundle": "*",
     "@remix-run/react": "*",
     "cross-env": "^7.0.3",
     "isbot": "^3.6.5",

diff --git a/templates/cloudflare-workers/app/root.tsx b/templates/cloudflare-workers/app/root.tsx
@@ -6,6 +6,12 @@ import {
   Scripts,
   ScrollRestoration,
 } from "@remix-run/react";
+import type { LinksFunction } from "@remix-run/node";
+import { cssBundleHref } from "@remix-run/css-bundle";
+
+export const links: LinksFunction = () => [
+  ...(cssBundleHref ? [{ rel: "stylesheet", href: cssBundleHref }] : []),
+];
 
 export default function App() {
   return (

diff --git a/templates/cloudflare-workers/package.json b/templates/cloudflare-workers/package.json
@@ -13,6 +13,7 @@
   "dependencies": {
     "@remix-run/cloudflare": "*",
     "@remix-run/cloudflare-workers": "*",
+    "@remix-run/css-bundle": "*",
     "@remix-run/react": "*",
     "cross-env": "^7.0.3",
     "isbot": "^3.6.5",

diff --git a/templates/deno/app/root.tsx b/templates/deno/app/root.tsx
@@ -6,8 +6,14 @@ import {
   Scripts,
   ScrollRestoration,
 } from "@remix-run/react";
+import type { LinksFunction } from "@remix-run/deno";
+import { cssBundleHref } from "@remix-run/css-bundle";
 import * as React from "react";
 
+export const links: LinksFunction = () => [
+  ...(cssBundleHref ? [{ rel: "stylesheet", href: cssBundleHref }] : []),
+];
+
 export default function App() {
   return (
     <html lang="en">

diff --git a/templates/deno/package.json b/templates/deno/package.json
@@ -13,6 +13,7 @@
     "typecheck": "deno check"
   },
   "dependencies": {
+    "@remix-run/css-bundle": "*",
     "@remix-run/deno": "*",
     "@remix-run/react": "*",
     "isbot": "^3.6.5",

diff --git a/templates/express/app/root.tsx b/templates/express/app/root.tsx
@@ -6,6 +6,12 @@ import {
   Scripts,
   ScrollRestoration,
 } from "@remix-run/react";
+import type { LinksFunction } from "@remix-run/node";
+import { cssBundleHref } from "@remix-run/css-bundle";
+
+export const links: LinksFunction = () => [
+  ...(cssBundleHref ? [{ rel: "stylesheet", href: cssBundleHref }] : []),
+];
 
 export default function App() {
   return (

diff --git a/templates/express/package.json b/templates/express/package.json
@@ -10,6 +10,7 @@
     "typecheck": "tsc"
   },
   "dependencies": {
+    "@remix-run/css-bundle": "*",
     "@remix-run/express": "*",
     "@remix-run/node": "*",
     "@remix-run/react": "*",

diff --git a/templates/fly/app/root.tsx b/templates/fly/app/root.tsx
@@ -6,6 +6,12 @@ import {
   Scripts,
   ScrollRestoration,
 } from "@remix-run/react";
+import type { LinksFunction } from "@remix-run/node";
+import { cssBundleHref } from "@remix-run/css-bundle";
+
+export const links: LinksFunction = () => [
+  ...(cssBundleHref ? [{ rel: "stylesheet", href: cssBundleHref }] : []),
+];
 
 export default function App() {
   return (

diff --git a/templates/fly/package.json b/templates/fly/package.json
@@ -9,6 +9,7 @@
     "typecheck": "tsc"
   },
   "dependencies": {
+    "@remix-run/css-bundle": "*",
     "@remix-run/node": "*",
     "@remix-run/react": "*",
     "@remix-run/serve": "*",

diff --git a/templates/netlify/app/root.tsx b/templates/netlify/app/root.tsx
@@ -6,6 +6,12 @@ import {
   Scripts,
   ScrollRestoration,
 } from "@remix-run/react";
+import type { LinksFunction } from "@remix-run/node";
+import { cssBundleHref } from "@remix-run/css-bundle";
+
+export const links: LinksFunction = () => [
+  ...(cssBundleHref ? [{ rel: "stylesheet", href: cssBundleHref }] : []),
+];
 
 export default function App() {
   return (

diff --git a/templates/netlify/package.json b/templates/netlify/package.json
@@ -9,6 +9,7 @@
   },
   "dependencies": {
     "@netlify/functions": "^1.3.0",
+    "@remix-run/css-bundle": "*",
     "@remix-run/netlify": "*",
     "@remix-run/node": "*",
     "@remix-run/react": "*",

diff --git a/templates/remix/app/root.tsx b/templates/remix/app/root.tsx
@@ -6,6 +6,12 @@ import {
   Scripts,
   ScrollRestoration,
 } from "@remix-run/react";
+import type { LinksFunction } from "@remix-run/node";
+import { cssBundleHref } from "@remix-run/css-bundle";
+
+export const links: LinksFunction = () => [
+  ...(cssBundleHref ? [{ rel: "stylesheet", href: cssBundleHref }] : []),
+];
 
 export default function App() {
   return (

diff --git a/templates/remix/package.json b/templates/remix/package.json
@@ -8,6 +8,7 @@
     "typecheck": "tsc"
   },
   "dependencies": {
+    "@remix-run/css-bundle": "*",
     "@remix-run/node": "*",
     "@remix-run/react": "*",
     "@remix-run/serve": "*",

diff --git a/templates/vercel/app/root.tsx b/templates/vercel/app/root.tsx
@@ -6,6 +6,12 @@ import {
   Scripts,
   ScrollRestoration,
 } from "@remix-run/react";
+import type { LinksFunction } from "@remix-run/node";
+import { cssBundleHref } from "@remix-run/css-bundle";
+
+export const links: LinksFunction = () => [
+  ...(cssBundleHref ? [{ rel: "stylesheet", href: cssBundleHref }] : []),
+];
 
 export default function App() {
   return (

diff --git a/templates/vercel/package.json b/templates/vercel/package.json
@@ -7,6 +7,7 @@
     "typecheck": "tsc"
   },
   "dependencies": {
+    "@remix-run/css-bundle": "*",
     "@remix-run/node": "*",
     "@remix-run/react": "*",
     "@remix-run/vercel": "*",