vite-plugin-remix-routes
Version:
Use Remix routing in your Vite project
226 lines (221 loc) • 7.69 kB
JavaScript
;
var __create = Object.create;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __getProtoOf = Object.getPrototypeOf;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
for (var name in all)
__defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
if (from && typeof from === "object" || typeof from === "function") {
for (let key of __getOwnPropNames(from))
if (!__hasOwnProp.call(to, key) && key !== except)
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
}
return to;
};
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
mod
));
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
// lib/node/index.ts
var node_exports = {};
__export(node_exports, {
default: () => node_default,
getRoutes: () => getRoutes,
stringifyRoutes: () => stringifyRoutes
});
module.exports = __toCommonJS(node_exports);
var import_node_path2 = __toESM(require("path"), 1);
var import_node_fs = __toESM(require("fs"), 1);
// lib/node/remix.ts
var defineConventionalRoutes;
var defineRoutes;
try {
defineConventionalRoutes = require("@remix-run/dev/config/routesConvention").defineConventionalRoutes;
} catch (e) {
defineConventionalRoutes = require("@remix-run/dev/dist/config/routesConvention").defineConventionalRoutes;
}
try {
defineRoutes = require("@remix-run/dev/config/routes").defineRoutes;
} catch (e) {
defineRoutes = require("@remix-run/dev/dist/config/routes").defineRoutes;
}
async function getRoutes(options) {
const {
appDirectory,
dataRouterCompatible = true,
is404Route = (route) => route.id.endsWith("/404"),
ignoredRouteFiles,
routes
} = options;
const routeManifest = {
root: { path: "", id: "root", file: "" }
};
const conventionalRoutes = defineConventionalRoutes(
appDirectory,
ignoredRouteFiles
);
for (const key of Object.keys(conventionalRoutes)) {
const route = conventionalRoutes[key];
routeManifest[route.id] = {
...route,
parentId: route.parentId || "root"
};
}
if (routes) {
let manualRoutes = await routes(defineRoutes);
for (const key of Object.keys(manualRoutes)) {
const route = manualRoutes[key];
routeManifest[route.id] = {
...route,
parentId: route.parentId || "root"
};
}
}
const routeConfig = createRoutes(routeManifest)[0].children;
const modifyRoute = (route) => ({
...route,
path: !dataRouterCompatible && is404Route(route) ? "*" : route.path,
children: route.children.map(modifyRoute)
});
return routeConfig.map(modifyRoute);
}
function createRoutes(routeManifest, parentId) {
return Object.keys(routeManifest).filter((key) => routeManifest[key].parentId === parentId).map((key) => {
const route = createRoute(routeManifest[key]);
route.children = createRoutes(routeManifest, route.id);
return route;
});
}
function createRoute(route) {
return {
id: route.id,
file: route.file,
path: route.path || "",
index: !!route.index,
children: []
};
}
// lib/node/utils.ts
var import_node_path = __toESM(require("path"), 1);
function stringifyRoutes(routes, context) {
const components = { sync: [], async: [] };
const routesString = routesToString(routes, context, components);
return {
routesString,
componentsString: [...components.sync, ...components.async].join("\n")
};
}
function routesToString(routes, context, components) {
return "[" + routes.map((route) => routeToString(route, context, components)).join(",") + "]";
}
function routeToString(route, context, components) {
var _a;
const importMode = ((_a = context.importMode) == null ? void 0 : _a.call(context, route)) || "sync";
const componentName = getRouteComponentName(route);
const componentPath = `${context.prefix}${import_node_path.default.sep}${route.file}`.split(import_node_path.default.sep).join(import_node_path.default.posix.sep);
const props = /* @__PURE__ */ new Map();
if (route.path !== "") {
props.set("path", `'${route.path}'`);
}
if (context.dataRouterCompatible) {
components.sync.push(
`import * as ${componentName} from '${componentPath}';`
);
props.set(
"element",
`${componentName}.default ? createElement(${componentName}.default) : undefined`
);
props.set("loader", `${componentName}.loader`);
props.set("action", `${componentName}.action`);
props.set(
"errorElement",
`${componentName}.ErrorBoundary ? createElement(${componentName}.ErrorBoundary) : undefined`
);
props.set("handle", `${componentName}.handle`);
props.set("shouldRevalidate", `${componentName}.shouldRevalidate`);
} else {
if (importMode === "async") {
components.async.push(
`const ${componentName} = () => import('${componentPath}');`
);
props.set("element", `createElement(lazy(${componentName}))`);
props.set("importPromise", componentName);
}
if (importMode === "sync") {
components.sync.push(`import ${componentName} from '${componentPath}';`);
props.set("element", `createElement(${componentName})`);
}
}
if (route.index === true) {
props.set("index", "true");
}
if (route.children.length) {
const children = routesToString(route.children, context, components);
props.set("children", children);
}
return "{" + [...props.entries()].map(([k, v]) => `${k}:${v}`).join(",") + "}";
}
function getRouteComponentName(route) {
return route.id.split(/[/.]/).map((str) => str.replace(/^\w/, (c) => c.toUpperCase())).join("");
}
// lib/node/index.ts
function plugin(options = {}) {
const virtualModuleId = "virtual:remix-routes";
const {
appDirectory = "app",
dataRouterCompatible,
importMode,
is404Route,
routes,
ignoredRouteFiles
} = options;
const dir = import_node_path2.default.resolve(process.cwd(), appDirectory);
const prefix = `.${import_node_path2.default.sep}${import_node_path2.default.relative(process.cwd(), dir)}`;
if (!import_node_fs.default.existsSync(import_node_path2.default.join(dir, "routes")) || !import_node_fs.default.statSync(import_node_path2.default.join(dir, "routes")).isDirectory()) {
throw new Error(
`[vite-plugin-remix-routes] routes directory not found in appDirectory: ${import_node_path2.default.relative(
process.cwd(),
appDirectory
)}`
);
}
return {
name: "vite-plugin-remix-routes",
resolveId(id) {
if (id === virtualModuleId) {
return id;
}
},
async load(id) {
if (id === virtualModuleId) {
const generatedRoutes = await getRoutes({
appDirectory: dir,
dataRouterCompatible,
is404Route,
routes,
ignoredRouteFiles
});
const { routesString, componentsString } = stringifyRoutes(
generatedRoutes,
{ prefix, dataRouterCompatible, importMode }
);
return `import { createElement, lazy, useEffect } from 'react';
${componentsString}
export default ${routesString};
`;
}
}
};
}
var node_default = plugin;
// Annotate the CommonJS export names for ESM import in node:
0 && (module.exports = {
getRoutes,
stringifyRoutes
});