Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

RSC: routes-auto-loader is not used for SSR anymore #10672

Merged
merged 3 commits into from
May 22, 2024
Merged

RSC: routes-auto-loader is not used for SSR anymore #10672

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
515c005
RSC: routes-auto-loader is not used for SSR anymore
Tobbe May 22, 2024
0b52548
Add one more comment to auto-loader plugin
Tobbe May 22, 2024
06adf08
Update snapshot tests
Tobbe May 22, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
19 changes: 9 additions & 10 deletions packages/vite/src/plugins/__tests__/vite-plugin-rsc-route-auto-loader.test.mts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -211,18 +211,17 @@ describe('rscRoutesAutoLoader', () => {
// - The import of `renderFromDist` from `@redwoodjs/vite/clientSsr`
// - The call to `renderFromDist` for each page that wasn't already imported
expect(output).toMatchInlineSnapshot(`
"import { renderFromDist } from "@redwoodjs/vite/clientSsr";
const EmptyUserNewEmptyUserPage = renderFromDist("EmptyUserNewEmptyUserPage");
const EmptyUserEmptyUsersPage = renderFromDist("EmptyUserEmptyUsersPage");
const EmptyUserEmptyUserPage = renderFromDist("EmptyUserEmptyUserPage");
const EmptyUserEditEmptyUserPage = renderFromDist("EmptyUserEditEmptyUserPage");
const HomePage = renderFromDist("HomePage");
const FatalErrorPage = renderFromDist("FatalErrorPage");
const AboutPage = renderFromDist("AboutPage");
"const EmptyUserNewEmptyUserPage = () => null;
const EmptyUserEmptyUsersPage = () => null;
const EmptyUserEmptyUserPage = () => null;
const EmptyUserEditEmptyUserPage = () => null;
const HomePage = () => null;
const FatalErrorPage = () => null;
const AboutPage = () => null;
import { jsx, jsxs } from "react/jsx-runtime";
import { Router, Route, Set } from "@redwoodjs/router";
import NavigationLayout from "./layouts/NavigationLayout/NavigationLayout";
import ScaffoldLayout from "./layouts/ScaffoldLayout/ScaffoldLayout";
import NavigationLayout from "@redwoodjs/router/dist/dummyComponent";
import ScaffoldLayout from "@redwoodjs/router/dist/dummyComponent";
import NotFoundPage from "./pages/NotFoundPage/NotFoundPage";
const Routes = () => {
return /* @__PURE__ */jsxs(Router, {
Expand Down
60 changes: 13 additions & 47 deletions packages/vite/src/plugins/vite-plugin-rsc-routes-auto-loader.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -63,7 +63,7 @@ export function rscRoutesAutoLoader(): Plugin {

return {
name: 'rsc-routes-auto-loader-dev',
transform: async function (code, id, options) {
transform: async function (code, id) {
// We only care about the routes file
if (id !== routesFileId) {
return null
Expand All @@ -74,12 +74,6 @@ export function rscRoutesAutoLoader(): Plugin {
return null
}

// We have to handle the loading of routes in two different ways depending on if
// we are doing SSR or not. During SSR we want to load files directly whereas on
// the client we have to fetch things over the network.
// TODO (RSC): ↑ Update comment to reflect what's actually going on
const isSsr = options?.ssr ?? false

// Parse the code as AST
const ext = path.extname(id)
const plugins: any[] = []
Expand Down Expand Up @@ -135,13 +129,10 @@ export function rscRoutesAutoLoader(): Plugin {
},
JSXElement() {
// The file is already transformed from JSX to `jsx()` and `jsxs()`
// calls when this plugin executes, so this will never get called
// function calls when this plugin executes, so no JSXElement nodes
// will be present in the AST.
},
CallExpression(path) {
if (isSsr) {
return
}

if (
(t.isIdentifier(path.node.callee, { name: 'jsxs' }) ||
t.isIdentifier(path.node.callee, { name: 'jsx' })) &&
Expand Down Expand Up @@ -178,47 +169,22 @@ export function rscRoutesAutoLoader(): Plugin {
const wrapperImport = allImports.get(wrapper)

if (wrapperImport) {
// This will turn all wrapper imports into something like
// import NavigationLayout from "@redwoodjs/router/dist/dummyComponent";
// which is all we need for client side routing
wrapperImport.source.value = '@redwoodjs/router/dist/dummyComponent'
}
})

// Insert the page loading into the code
// All pages will just be `const NameOfPage = () => null`
for (const page of nonImportedPages) {
if (isSsr) {
ast.program.body.unshift(
t.variableDeclaration('const', [
t.variableDeclarator(
t.identifier(page.constName),
t.callExpression(t.identifier('renderFromDist'), [
t.stringLiteral(page.constName),
]),
),
]),
)
} else {
ast.program.body.unshift(
t.variableDeclaration('const', [
t.variableDeclarator(
t.identifier(page.constName),
t.arrowFunctionExpression([], t.nullLiteral()),
),
]),
)
}
}

if (isSsr) {
// Insert an import for the load function we need
ast.program.body.unshift(
t.importDeclaration(
[
t.importSpecifier(
t.identifier('renderFromDist'),
t.identifier('renderFromDist'),
),
],
t.stringLiteral('@redwoodjs/vite/clientSsr'),
),
t.variableDeclaration('const', [
t.variableDeclarator(
t.identifier(page.constName),
t.arrowFunctionExpression([], t.nullLiteral()),
),
]),
)
}

Expand Down
Loading