How to create nested page?

[fax1ty]

config

import { defineConfig } from "vite";
import { swcReactRefresh } from "vite-plugin-swc-react-refresh";
import svgr from "vite-plugin-svgr";
import { createMpaPlugin } from "vite-plugin-virtual-mpa";
import { readdir } from "fs/promises";

const pagesDir = "./pages";

const getPages = async (path: string) => {
  const data = await readdir(path, { withFileTypes: true });
  const pages = [];
  for (const stats of data) {
    if (stats.isFile() && stats.name === "_entry.tsx") {
      pages.push({
        name: path.replace(pagesDir, "").replace("/", ""),
        entry: path + "/" + stats.name,
      });
    } else if (stats.isDirectory()) {
      const newPages = await getPages(path + "/" + stats.name);
      pages.push(...newPages);
    }
  }
  return pages;
};

export default defineConfig({
  plugins: [
    swcReactRefresh(),
    svgr(),
    createMpaPlugin({
      template: "public/index.html",
      rewrites: [
        {
          from: /\/(.*)/,
          to: (ctx) => `/${!ctx.match[1] ? "index" : ctx.match[1]}.html`,
        },
      ],
      pages: await getPages(pagesDir),
    }),
  ],
  esbuild: { jsx: "automatic" },
});

[emosheeep]

Could you show me the code about imports or github repository or codesanbox？ I can't locate the problem. Logs from console look normal.

I just saw your template file was put into public dir which will be proxyed by vite after DevServer started. It will make conflicts. If this isn't your needs, you should add publicDir: false to your config or move index.html to root dir.

The error you encountered looks like you didn't introduce any plugin to handle jsx file, if you're using react, you can try to use official plugin @vitejs/plugin-react

[fax1ty]

@emosheeep https://github.com/fax1ty/mpa-problem

[emosheeep]

@fax1ty The enrty path should start with '/', it must be an absolute path relative to the root path. I'll improve the type declarations and runtime logic about it to prevent this silly problem. For now, you can try to change your code as follows to solve the problem.

entry: '/' + path + "/" + stats.name,

[emosheeep]

@fax1ty I made some changes and publish a new version 1.1.0, maybe you could have a try.