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.

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

Remove publicPath from resolved config #11575

Merged
merged 3 commits into from
May 23, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
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
5 changes: 5 additions & 0 deletions .changeset/remove-build-end-public-path.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"@react-router/dev": major
---

For Remix consumers migrating to React Router who used the Vite plugin's `buildEnd` hook, the resolved `reactRouterConfig` object no longer contains a `publicPath` property since this belongs to Vite, not React Router.
1 change: 0 additions & 1 deletion integration/vite-presets-test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -214,7 +214,6 @@ test("Vite / presets", async () => {
"buildEnd",
"future",
"prerender",
"publicPath",
"routes",
"serverBuildFile",
"serverBundles",
Expand Down
11 changes: 5 additions & 6 deletions packages/remix-dev/config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -193,10 +193,6 @@ export type ResolvedVitePluginConfig = Readonly<{
* An array of URLs to prerender to HTML files at build time.
*/
prerender: Array<string> | null;
/**
* Derived from Vite's `base` config
* */
publicPath: string;
/**
* An object of all available routes, keyed by route id.
*/
Expand Down Expand Up @@ -314,6 +310,10 @@ let deepFreeze = (o: any) => {
return o;
};

export function resolvePublicPath(viteUserConfig: Vite.UserConfig) {
return viteUserConfig.base ?? "/";
}

export async function resolveReactRouterConfig({
rootDirectory,
reactRouterUserConfig,
Expand Down Expand Up @@ -404,7 +404,7 @@ export async function resolveReactRouterConfig({

let appDirectory = path.resolve(rootDirectory, userAppDirectory || "app");
let buildDirectory = path.resolve(rootDirectory, userBuildDirectory);
let publicPath = viteUserConfig.base ?? "/";
let publicPath = resolvePublicPath(viteUserConfig);

if (
basename !== "/" &&
Expand Down Expand Up @@ -453,7 +453,6 @@ export async function resolveReactRouterConfig({
buildEnd,
future,
prerender,
publicPath,
routes,
serverBuildFile,
serverBundles,
Expand Down
28 changes: 15 additions & 13 deletions packages/remix-dev/vite/plugin.ts
Original file line number Diff line number Diff line change
Expand Up @@ -36,6 +36,7 @@ import {
type ResolvedVitePluginConfig,
resolveReactRouterConfig,
resolveEntryFiles,
resolvePublicPath,
} from "../config";

export async function resolveViteConfig({
Expand Down Expand Up @@ -150,6 +151,7 @@ export type ReactRouterPluginContext = ReactRouterPluginSsrBuildContext & {
rootDirectory: string;
entryClientFilePath: string;
entryServerFilePath: string;
publicPath: string;
reactRouterConfig: ResolvedVitePluginConfig;
viteManifestEnabled: boolean;
};
Expand Down Expand Up @@ -233,14 +235,14 @@ const getReactRouterManifestBuildAssets = (
]);

return {
module: `${ctx.reactRouterConfig.publicPath}${entryChunk.file}`,
module: `${ctx.publicPath}${entryChunk.file}`,
imports:
dedupe(chunks.flatMap((e) => e.imports ?? [])).map((imported) => {
return `${ctx.reactRouterConfig.publicPath}${viteManifest[imported].file}`;
return `${ctx.publicPath}${viteManifest[imported].file}`;
}) ?? [],
css:
dedupe(chunks.flatMap((e) => e.css ?? [])).map((href) => {
return `${ctx.reactRouterConfig.publicPath}${href}`;
return `${ctx.publicPath}${href}`;
}) ?? [],
};
};
Expand Down Expand Up @@ -442,6 +444,7 @@ export const reactRouterVitePlugin: ReactRouterVitePlugin = (_config) => {
reactRouterConfig,
});

let publicPath = resolvePublicPath(viteUserConfig);
let viteManifestEnabled = viteUserConfig.build?.manifest === true;

let ssrBuildCtx: ReactRouterPluginSsrBuildContext =
Expand All @@ -460,6 +463,7 @@ export const reactRouterVitePlugin: ReactRouterVitePlugin = (_config) => {
rootDirectory,
entryClientFilePath,
entryServerFilePath,
publicPath,
viteManifestEnabled,
...ssrBuildCtx,
};
Expand Down Expand Up @@ -507,9 +511,7 @@ export const reactRouterVitePlugin: ReactRouterVitePlugin = (_config) => {
export const isSpaMode = ${
!ctx.reactRouterConfig.ssr && ctx.reactRouterConfig.prerender == null
};
export const publicPath = ${JSON.stringify(
ctx.reactRouterConfig.publicPath
)};
export const publicPath = ${JSON.stringify(ctx.publicPath)};
export const entry = { module: entryServer };
export const routes = {
${Object.keys(routes)
Expand Down Expand Up @@ -625,7 +627,7 @@ export const reactRouterVitePlugin: ReactRouterVitePlugin = (_config) => {
viteConfig.build.assetsDir,
`manifest-${version}.js`
);
let url = `${ctx.reactRouterConfig.publicPath}${manifestPath}`;
let url = `${ctx.publicPath}${manifestPath}`;
let nonFingerprintedValues = { url, version };

let reactRouterBrowserManifest: ReactRouterManifest = {
Expand Down Expand Up @@ -671,7 +673,7 @@ export const reactRouterVitePlugin: ReactRouterVitePlugin = (_config) => {
index: route.index,
caseSensitive: route.caseSensitive,
module: path.posix.join(
ctx.reactRouterConfig.publicPath,
ctx.publicPath,
`${resolveFileUrl(
ctx,
resolveRelativeRouteFilePath(route, ctx.reactRouterConfig)
Expand All @@ -689,18 +691,18 @@ export const reactRouterVitePlugin: ReactRouterVitePlugin = (_config) => {
return {
version: String(Math.random()),
url: path.posix.join(
ctx.reactRouterConfig.publicPath,
ctx.publicPath,
VirtualModule.url(browserManifestId)
),
hmr: {
runtime: path.posix.join(
ctx.reactRouterConfig.publicPath,
ctx.publicPath,
VirtualModule.url(injectHmrRuntimeId)
),
},
entry: {
module: path.posix.join(
ctx.reactRouterConfig.publicPath,
ctx.publicPath,
resolveFileUrl(ctx, ctx.entryClientFilePath)
),
imports: [],
Expand Down Expand Up @@ -1624,15 +1626,15 @@ async function getRouteMetadata(
index: route.index,
caseSensitive: route.caseSensitive,
url: path.posix.join(
ctx.reactRouterConfig.publicPath,
ctx.publicPath,
"/" +
path.relative(
ctx.rootDirectory,
resolveRelativeRouteFilePath(route, ctx.reactRouterConfig)
)
),
module: path.posix.join(
ctx.reactRouterConfig.publicPath,
ctx.publicPath,
`${resolveFileUrl(
ctx,
resolveRelativeRouteFilePath(route, ctx.reactRouterConfig)
Expand Down
Loading