@solidjs/start 2.0.0-beta.0 → 2.0.0-beta.2

package/src/config/fs-routes/tree-shake.ts

@@ -1,324 +0,0 @@
-// All credit for this work goes to the amazing Next.js team.
-// https://github.com/vercel/next.js/blob/canary/packages/next/build/babel/plugins/next-ssg-transform.ts
-// This is adapted to work with routeData functions. It can be run in two modes, one which preserves the routeData and the Component in the same file, and one which creates a
-
-import type * as Babel from "@babel/core";
-import type { NodePath, PluginObj, PluginPass } from "@babel/core";
-import type { Binding } from "@babel/traverse";
-import { basename } from "pathe";
-import type { Plugin } from "vite";
-
-type State = Omit<PluginPass, "opts"> & {
-  opts: { pick: string[] };
-  refs: Set<any>;
-  done: boolean;
-};
-
-function treeShakeTransform({ types: t }: typeof Babel): PluginObj<State> {
-  function getIdentifier(path: any) {
-    const parentPath = path.parentPath;
-    if (parentPath.type === "VariableDeclarator") {
-      const pp = parentPath;
-      const name = pp.get("id");
-      return name.node.type === "Identifier" ? name : null;
-    }
-    if (parentPath.type === "AssignmentExpression") {
-      const pp = parentPath;
-      const name = pp.get("left");
-      return name.node.type === "Identifier" ? name : null;
-    }
-    if (path.node.type === "ArrowFunctionExpression") {
-      return null;
-    }
-    return path.node.id && path.node.id.type === "Identifier" ? path.get("id") : null;
-  }
-
-  function isIdentifierReferenced(ident: any) {
-    const b: Binding | undefined = ident.scope.getBinding(ident.node.name);
-    if (b?.referenced) {
-      if (b.path.type === "FunctionDeclaration") {
-        return !b.constantViolations
-          .concat(b.referencePaths)
-          .every(ref => ref.findParent(p => p === b.path));
-      }
-      return true;
-    }
-    return false;
-  }
-  function markFunction(path: any, state: any) {
-    const ident = getIdentifier(path);
-    if (ident && ident.node && isIdentifierReferenced(ident)) {
-      state.refs.add(ident);
-    }
-  }
-  function markImport(path: any, state: any) {
-    const local = path.get("local");
-    if (isIdentifierReferenced(local)) {
-      state.refs.add(local);
-    }
-  }
-
-  return {
-    visitor: {
-      Program: {
-        enter(path, state) {
-          state.refs = new Set();
-          state.done = false;
-          path.traverse(
-            {
-              VariableDeclarator(variablePath, variableState: any) {
-                if (variablePath.node.id.type === "Identifier") {
-                  const local = variablePath.get("id");
-                  if (isIdentifierReferenced(local)) {
-                    variableState.refs.add(local);
-                  }
-                } else if (variablePath.node.id.type === "ObjectPattern") {
-                  const pattern = variablePath.get("id");
-                  const properties = pattern.get("properties") as Array<NodePath>;
-                  properties.forEach(p => {
-                    const local = p.get(
-                      p.node.type === "ObjectProperty"
-                        ? "value"
-                        : p.node.type === "RestElement"
-                          ? "argument"
-                          : (() => {
-                              throw new Error("invariant");
-                            })(),
-                    );
-                    if (isIdentifierReferenced(local)) {
-                      variableState.refs.add(local);
-                    }
-                  });
-                } else if (variablePath.node.id.type === "ArrayPattern") {
-                  const pattern = variablePath.get("id");
-                  const elements = pattern.get("elements") as Array<NodePath>;
-                  elements.forEach(e => {
-                    let local: NodePath<any>;
-                    if (e.node && e.node.type === "Identifier") {
-                      local = e;
-                    } else if (e.node && e.node.type === "RestElement") {
-                      local = e.get("argument");
-                    } else {
-                      return;
-                    }
-                    if (isIdentifierReferenced(local)) {
-                      variableState.refs.add(local);
-                    }
-                  });
-                }
-              },
-              ExportDefaultDeclaration(exportNamedPath) {
-                // if opts.keep is true, we don't remove the routeData export
-                if (state.opts.pick && !state.opts.pick.includes("default")) {
-                  exportNamedPath.remove();
-                }
-              },
-              ExportNamedDeclaration(exportNamedPath) {
-                // if opts.keep is false, we don't remove the routeData export
-                if (!state.opts.pick) {
-                  return;
-                }
-                const specifiers = exportNamedPath.get("specifiers");
-                if (specifiers.length) {
-                  specifiers.forEach(s => {
-                    if (
-                      t.isIdentifier(s.node.exported)
-                        ? s.node.exported.name
-                        : state.opts.pick.includes(s.node.exported.value)
-                    ) {
-                      s.remove();
-                    }
-                  });
-                  if (exportNamedPath.node.specifiers.length < 1) {
-                    exportNamedPath.remove();
-                  }
-                  return;
-                }
-                const decl = exportNamedPath.get("declaration");
-                if (decl == null || decl.node == null) {
-                  return;
-                }
-                switch (decl.node.type) {
-                  case "FunctionDeclaration": {
-                    const name = decl.node.id?.name;
-                    if (name && state.opts.pick && !state.opts.pick.includes(name)) {
-                      exportNamedPath.remove();
-                    }
-                    break;
-                  }
-                  case "VariableDeclaration": {
-                    const inner = decl.get("declarations") as Array<NodePath<any>>;
-                    inner.forEach(d => {
-                      if (d.node.id.type !== "Identifier") {
-                        return;
-                      }
-                      const name = d.node.id.name;
-                      if (state.opts.pick && !state.opts.pick.includes(name)) {
-                        d.remove();
-                      }
-                    });
-                    break;
-                  }
-                  default: {
-                    break;
-                  }
-                }
-              },
-              FunctionDeclaration: markFunction,
-              FunctionExpression: markFunction,
-              ArrowFunctionExpression: markFunction,
-              ImportSpecifier: markImport,
-              ImportDefaultSpecifier: markImport,
-              ImportNamespaceSpecifier: markImport,
-              ImportDeclaration: (path, state) => {
-                if (
-                  path.node.source.value.endsWith(".css") &&
-                  state.opts.pick &&
-                  !state.opts.pick.includes("$css")
-                ) {
-                  path.remove();
-                }
-              },
-            },
-            state,
-          );
-
-          const refs = state.refs;
-          let count = 0;
-          const sweepFunction = (sweepPath: any) => {
-            const ident = getIdentifier(sweepPath);
-            if (ident && ident.node && refs.has(ident) && !isIdentifierReferenced(ident)) {
-              ++count;
-              if (
-                t.isAssignmentExpression(sweepPath.parentPath) ||
-                t.isVariableDeclarator(sweepPath.parentPath)
-              ) {
-                sweepPath.parentPath.remove();
-              } else {
-                sweepPath.remove();
-              }
-            }
-          };
-          function sweepImport(sweepPath: any) {
-            const local = sweepPath.get("local");
-            if (refs.has(local) && !isIdentifierReferenced(local)) {
-              ++count;
-              sweepPath.remove();
-              if (sweepPath.parent.specifiers.length === 0) {
-                sweepPath.parentPath.remove();
-              }
-            }
-          }
-          do {
-            path.scope.crawl();
-            count = 0;
-            path.traverse({
-              VariableDeclarator(variablePath) {
-                if (variablePath.node.id.type === "Identifier") {
-                  const local = variablePath.get("id");
-                  if (refs.has(local) && !isIdentifierReferenced(local)) {
-                    ++count;
-                    variablePath.remove();
-                  }
-                } else if (variablePath.node.id.type === "ObjectPattern") {
-                  const pattern = variablePath.get("id");
-                  const beforeCount = count;
-                  const properties = pattern.get("properties");
-                  properties.forEach(p => {
-                    const local = p.get(
-                      p.node.type === "ObjectProperty"
-                        ? "value"
-                        : p.node.type === "RestElement"
-                          ? "argument"
-                          : (() => {
-                              throw new Error("invariant");
-                            })(),
-                    );
-                    if (refs.has(local) && !isIdentifierReferenced(local)) {
-                      ++count;
-                      p.remove();
-                    }
-                  });
-                  if (beforeCount !== count && pattern.get("properties").length < 1) {
-                    variablePath.remove();
-                  }
-                } else if (variablePath.node.id.type === "ArrayPattern") {
-                  const pattern = variablePath.get("id");
-                  const beforeCount = count;
-                  const elements = pattern.get("elements");
-                  elements.forEach(e => {
-                    let local: NodePath<any> | undefined;
-                    if (e.node && e.node.type === "Identifier") {
-                      local = e;
-                    } else if (e.node && e.node.type === "RestElement") {
-                      local = e.get("argument");
-                    } else {
-                      return;
-                    }
-                    if (refs.has(local) && !isIdentifierReferenced(local)) {
-                      ++count;
-                      e.remove();
-                    }
-                  });
-                  if (beforeCount !== count && pattern.get("elements").length < 1) {
-                    variablePath.remove();
-                  }
-                }
-              },
-              FunctionDeclaration: sweepFunction,
-              FunctionExpression: sweepFunction,
-              ArrowFunctionExpression: sweepFunction,
-              ImportSpecifier: sweepImport,
-              ImportDefaultSpecifier: sweepImport,
-              ImportNamespaceSpecifier: sweepImport,
-            });
-          } while (count);
-        },
-      },
-    },
-  };
-}
-
-export function treeShake(): Plugin {
-  async function transform(id: string, code: string) {
-    const [path, queryString] = id.split("?");
-    const query = new URLSearchParams(queryString);
-    if (query.has("pick")) {
-      const babel = await import("@babel/core");
-      const transformed = await babel.transformAsync(code, {
-        plugins: [[treeShakeTransform, { pick: query.getAll("pick") }]],
-        parserOpts: {
-          plugins: ["jsx", "typescript"],
-        },
-        filename: basename(id),
-        ast: false,
-        sourceMaps: true,
-        configFile: false,
-        babelrc: false,
-        sourceFileName: id,
-      });
-
-      return transformed;
-    }
-  }
-  return {
-    name: "tree-shake",
-    enforce: "pre",
-    async transform(code, id) {
-      const [path, queryString] = id.split("?");
-      if (!path) return;
-      const query = new URLSearchParams(queryString);
-      const ext = path.split(".").pop();
-      if (!ext) return;
-      if (query.has("pick") && ["js", "jsx", "ts", "tsx"].includes(ext)) {
-        const transformed = await transform(id, code);
-        if (!transformed?.code) return;
-
-        return {
-          code: transformed.code,
-          map: transformed.map,
-        };
-      }
-    },
-  };
-}

package/src/config/index.ts

@@ -1,239 +0,0 @@
-import { defu } from "defu";
-import { globSync } from "node:fs";
-import { extname, isAbsolute, join } from "node:path";
-import type { PluginOption } from "vite";
-import solid, { type Options as SolidOptions } from "vite-plugin-solid";
-import { type ServerFunctionsOptions, serverFunctionsPlugin } from "../directives/index.ts";
-import { DEFAULT_EXTENSIONS, VIRTUAL_MODULES, VITE_ENVIRONMENTS } from "./constants.ts";
-import { devServer } from "./dev-server.ts";
-import { envPlugin, type EnvPluginOptions } from "./env.ts";
-import { SolidStartClientFileRouter, SolidStartServerFileRouter } from "./fs-router.ts";
-import { fsRoutes } from "./fs-routes/index.ts";
-import type { BaseFileSystemRouter } from "./fs-routes/router.ts";
-import lazy from "./lazy.ts";
-import { manifest } from "./manifest.ts";
-import { parseIdQuery } from "./utils.ts";
-
-export interface SolidStartOptions {
-  solid?: Partial<SolidOptions>;
-  ssr?: boolean;
-  routeDir?: string;
-  extensions?: string[];
-  middleware?: string;
-  serialization?: {
-    /**
-     * The serialization mode to use for server functions/actions.
-     * The "js" mode uses a custom binary format that is more efficient than JSON, but requires a custom deserializer (with `eval()`) on the client.
-     * A strong CSP should block `eval()` executions, which would prevent the "js" mode from working.
-     * The "json" mode uses JSON for serialization, which is less efficient but can be deserialized with `JSON.parse` on the client.
-     *
-     * @default "json"
-     */
-    mode?: "js" | "json";
-  };
-  env?: EnvPluginOptions;
-  serverFunctions?: Pick<ServerFunctionsOptions, "filter">;
-}
-
-const absolute = (path: string, root: string) =>
-  path ? (isAbsolute(path) ? path : join(root, path)) : path;
-
-export function solidStart(options?: SolidStartOptions): Array<PluginOption> {
-  const start = defu(options ?? {}, {
-    appRoot: "./src",
-    routeDir: "./routes",
-    ssr: true,
-    devOverlay: true,
-    experimental: {
-      islands: false,
-    },
-    solid: {},
-    extensions: [],
-  });
-  const extensions = [...DEFAULT_EXTENSIONS, ...(start.extensions || [])];
-  const routeDir = join(start.appRoot, start.routeDir);
-  const root = process.cwd();
-  const appEntryPath = globSync(join(root, start.appRoot, "app.{j,t}sx"))[0];
-  if (!appEntryPath) {
-    throw new Error(`Could not find an app jsx/tsx entry in ${start.appRoot}.`);
-  }
-  const entryExtension = extname(appEntryPath);
-  const handlers = {
-    client: `${start.appRoot}/entry-client${entryExtension}`,
-    server: `${start.appRoot}/entry-server${entryExtension}`,
-  };
-  return [
-    // TODO (Alexis): check if the comment below is still relevant
-    //
-    // Must be placed after fsRoutes, as treeShake will remove the
-    // server fn exports added in by this plugin
-    serverFunctionsPlugin({
-      manifest: VIRTUAL_MODULES.serverFnManifest,
-      runtime: {
-        server: '@solidjs/start/fns/server',
-        client: '@solidjs/start/fns/client',
-      },
-      filter: options?.serverFunctions?.filter,
-    }),
-    {
-      name: "solid-start:config",
-      enforce: "pre",
-      configEnvironment(name) {
-        return {
-          resolve: {
-            // remove when https://github.com/solidjs/vite-plugin-solid/pull/228 is released
-            externalConditions: ["solid", "node"],
-          },
-        };
-      },
-      async config(_, env) {
-        const clientInput = [handlers.client];
-        if (env.command === "build") {
-          const clientRouter: BaseFileSystemRouter = (globalThis as any).ROUTERS.client;
-          for (const route of await clientRouter.getRoutes()) {
-            for (const [key, value] of Object.entries(route)) {
-              if (value && key.startsWith("$") && !key.startsWith("$$")) {
-                function toRouteId(route: any) {
-                  return `${route.src}?${route.pick.map((p: string) => `pick=${p}`).join("&")}`;
-                }
-                clientInput.push(toRouteId(value));
-              }
-            }
-          }
-        }
-        return {
-          appType: "custom",
-          build: { assetsDir: "_build/assets" },
-          optimizeDeps: {
-            // Suppress TS errors from Vite 7 types when configuring Vite 8's Rolldown
-            ...({
-              rolldownOptions: {
-                transform: {
-                  jsx: "react",
-                },
-              },
-            } as any),
-          },
-          environments: {
-            [VITE_ENVIRONMENTS.client]: {
-              consumer: "client",
-              build: {
-                write: true,
-                manifest: true,
-                outDir: "dist/client",
-                rollupOptions: {
-                  input: clientInput,
-                  treeshake: true,
-                  preserveEntrySignatures: "exports-only",
-                },
-              },
-            },
-            [VITE_ENVIRONMENTS.server]: {
-              consumer: "server",
-              build: {
-                ssr: true,
-                write: true,
-                manifest: true,
-                copyPublicDir: false,
-                rollupOptions: {
-                  input: "~/entry-server.tsx",
-                },
-                outDir: "dist/server",
-                commonjsOptions: {
-                  include: [/node_modules/],
-                },
-              },
-            },
-          },
-          resolve: {
-            alias: {
-              "@solidjs/start/server/entry": handlers.server,
-              "~": join(process.cwd(), start.appRoot),
-              ...(!start.ssr
-                ? {
-                    "@solidjs/start/server": "@solidjs/start/server/spa",
-                    "@solidjs/start/client": "@solidjs/start/client/spa",
-                  }
-                : {}),
-            },
-            // Depending on the package manager and dependency structure Vite externalizes @solidjs/start
-            // This makes sure that @solidjs/start goes through the Vite build process
-            noExternal: ["@solidjs/start"],
-          },
-          define: {
-            "import.meta.env.MANIFEST": `globalThis.MANIFEST`,
-            "import.meta.env.START_SSR": JSON.stringify(start.ssr),
-            // Use JSON.stringify so backslashes on Windows are escaped and
-            // esbuild receives a valid JS string literal for the define value
-            "import.meta.env.START_APP_ENTRY": JSON.stringify(appEntryPath),
-            "import.meta.env.START_CLIENT_ENTRY": JSON.stringify(handlers.client),
-            "import.meta.env.START_DEV_OVERLAY": JSON.stringify(start.devOverlay),
-            "import.meta.env.SEROVAL_MODE": JSON.stringify(start.serialization?.mode || "json"),
-          },
-          builder: {
-            sharedPlugins: true,
-            async buildApp(builder) {
-              const client = builder.environments[VITE_ENVIRONMENTS.client];
-              const server = builder.environments[VITE_ENVIRONMENTS.server];
-
-              if (!client) throw new Error("Client environment not found");
-              if (!server) throw new Error("SSR environment not found");
-
-              if (!client.isBuilt) await builder.build(client);
-              if (!server.isBuilt) await builder.build(server);
-            },
-          },
-        };
-      },
-    },
-    manifest(start),
-    fsRoutes({
-      routers: {
-        client: new SolidStartClientFileRouter({
-          dir: absolute(routeDir, root),
-          extensions,
-        }),
-        ssr: new SolidStartServerFileRouter({
-          dir: absolute(routeDir, root),
-          extensions,
-          dataOnly: !start.ssr,
-        }),
-      },
-    }),
-    lazy(),
-    envPlugin(options?.env),
-    {
-      name: "solid-start:virtual-modules",
-      async resolveId(id) {
-        const { filename, query } = parseIdQuery(id);
-
-        let base;
-        if (filename === VIRTUAL_MODULES.clientEntry) base = handlers.client;
-        if (filename === VIRTUAL_MODULES.serverEntry) base = handlers.server;
-        if (filename === VIRTUAL_MODULES.app) base = appEntryPath;
-
-        if (base) {
-          let id = (await this.resolve(base))?.id;
-          if (!id) return;
-
-          if (query.size > 0) id += `?${query.toString()}`;
-          return id;
-        }
-      },
-    },
-    {
-      name: "solid-start:capture-client-bundle",
-      enforce: "post",
-      generateBundle(options, bundle) {
-        globalThis.START_CLIENT_BUNDLE = bundle;
-        (globalThis as any).START_CLIENT_OUT_DIR = options.dir;
-      },
-    },
-    devServer(),
-    solid({
-      ...start.solid,
-      ssr: true,
-      extensions: extensions.map(ext => `.${ext}`),
-    }),
-  ];
-}

package/src/config/lazy.ts

@@ -1,132 +0,0 @@
-import type { PluginItem } from "@babel/core";
-import babel from "@babel/core";
-import * as t from "@babel/types";
-import { sep as osSep } from "node:path";
-import { basename, relative, sep } from "node:path/posix";
-import type { PluginOption } from "vite";
-import { VITE_ENVIRONMENTS } from "./constants.ts";
-
-const idTransform = (id: string): PluginItem => {
-  return {
-    visitor: {
-      Program(path) {
-        path.node.body.unshift(
-          t.exportNamedDeclaration(
-            t.variableDeclaration("const", [
-              t.variableDeclarator(t.identifier("id$$"), t.stringLiteral(id)),
-            ]),
-          ),
-        );
-      },
-    },
-  };
-};
-
-const importTransform = (): PluginItem => {
-  return {
-    visitor: {
-      ImportDeclaration(path) {
-        if (path.node.source.value !== "solid-js") return;
-        path.traverse({
-          ImportSpecifier(subPath) {
-            if (subPath.node.local.name !== "lazy") return;
-            subPath.remove();
-            path.insertAfter(
-              t.importDeclaration(
-                [t.importSpecifier(t.identifier("lazy"), t.identifier("lazy"))],
-                t.stringLiteral("@solidjs/start/server"),
-              ),
-            );
-          },
-        });
-      },
-    },
-  };
-};
-
-const fileEndingRegex = /(ts|js)x(\?.*)?$/;
-
-const lazy = (): PluginOption => {
-  const cwd = process.cwd().replaceAll(osSep, sep);
-
-  /**
-   * Maps module ids to their client-specific shared chunk names.
-   * Modules in shared chunks need to find their assets via the chunk name, instead of their module id.
-   *
-   * Vite includes assets of such modules in the manifest via the chunk name:
-   * https://github.com/vitejs/vite/blob/4be37a8389c67873880f826b01fe40137e1c29a7/packages/vite/src/node/plugins/manifest.ts#L179
-   * https://github.com/vitejs/vite/blob/4be37a8389c67873880f826b01fe40137e1c29a7/packages/vite/src/node/plugins/manifest.ts#L319
-   *
-   * Rollup occassionally creates shared chunks automatically,
-   * but they can also be manually created by the user via:
-   * https://rollupjs.org/configuration-options/#output-manualchunks
-   *
-   * More infos on Rollup's logic:
-   * https://github.com/rollup/rollup/issues/3772#issuecomment-689955168
-   */
-  const sharedChunkNames: Record<string, string> = {};
-
-  return {
-    name: "solid-lazy-css",
-    enforce: "pre",
-    generateBundle(_, bundle) {
-      if (this.environment.name !== VITE_ENVIRONMENTS.client) return;
-
-      for (const chunk of Object.values(bundle)) {
-        if (chunk.type !== "chunk" || !chunk.isDynamicEntry || chunk.facadeModuleId) continue;
-
-        // Has to follow Vites implementation:
-        // https://github.com/vitejs/vite/blob/4be37a8389c67873880f826b01fe40137e1c29a7/packages/vite/src/node/plugins/manifest.ts#L179
-        const chunkName = `_${basename(chunk.fileName)}`;
-        for (const id of chunk.moduleIds) {
-          sharedChunkNames[id] = chunkName;
-        }
-      }
-    },
-    async transform(src, id) {
-      if (this.environment.name !== VITE_ENVIRONMENTS.server) return;
-      if (!id.match(fileEndingRegex)) return;
-
-      // The transformed files either import "lazy" or css files
-      // Therefore we skip, if the src doesn't have any import
-      if (src.indexOf("import") === -1) return;
-      if (id.includes("entry-server")) return;
-
-      const plugins: PluginItem[] = [];
-
-      const hasDefaultExport = src.indexOf("export default") !== -1;
-      if (hasDefaultExport) {
-        const localId = relative(cwd, id);
-        const chunkName = sharedChunkNames[id];
-        plugins.push(idTransform(chunkName ?? localId));
-      }
-
-      const hasLazy = src.indexOf("lazy(") !== -1;
-      if (hasLazy) plugins.push(importTransform());
-
-      if (!plugins.length) {
-        return;
-      }
-
-      const transformed = await babel.transformAsync(src, {
-        plugins,
-        parserOpts: {
-          plugins: ["jsx", "typescript"],
-        },
-        filename: basename(id),
-        ast: false,
-        sourceMaps: true,
-        configFile: false,
-        babelrc: false,
-        sourceFileName: id,
-      });
-
-      if (!transformed?.code) return;
-
-      const { code, map } = transformed;
-      return { code, map };
-    },
-  };
-};
-
-export default lazy;