@solidjs/start 0.4.3 → 0.4.5

package/config/index.d.ts

@@ -1,5 +1,7 @@
 import { AppOptions } from "vinxi";
 import { InlineConfig } from "vite";
+import type { Options } from "vite-plugin-solid";
+
 
 type SolidStartInlineConfig = Omit<InlineConfig, "router"> & {
     start?: {
@@ -9,6 +11,7 @@ type SolidStartInlineConfig = Omit<InlineConfig, "router"> & {
          * async: ssr is in async mode
          */
         ssr?: boolean | "async",
+        solid?: Options,
         extensions?: string[],
         server?: AppOptions['server'],
         appRoot?: string,
@@ -17,4 +20,4 @@ type SolidStartInlineConfig = Omit<InlineConfig, "router"> & {
     }
 }
 
-export declare function defineConfig(baseConfig?: SolidStartInlineConfig)
+export declare function defineConfig(baseConfig?: SolidStartInlineConfig)

package/config/index.js

@@ -79,7 +79,17 @@ export function defineConfig(baseConfig = {}) {
         extensions,
         target: "server",
         plugins: async () => [
-          config("user", userConfig),
+          config("user", {
+            ...userConfig,
+            optimizeDeps: {
+              ...(userConfig.optimizeDeps || {}),
+              include: [
+                ...(userConfig.optimizeDeps?.include || []),
+                '@solidjs/start > source-map-js',
+                '@solidjs/start > error-stack-parser',
+              ],
+            },
+          }),
           ...(typeof plugins === "function" ? [...(await plugins())] : plugins),
 
           serverTransform({
@@ -121,7 +131,17 @@ export function defineConfig(baseConfig = {}) {
         extensions,
         target: "browser",
         plugins: async () => [
-          config("user", userConfig),
+          config("user", {
+            ...userConfig,
+            optimizeDeps: {
+              ...(userConfig.optimizeDeps || {}),
+              include: [
+                ...(userConfig.optimizeDeps?.include || []),
+                '@solidjs/start > source-map-js',
+                '@solidjs/start > error-stack-parser',
+              ],
+            },
+          }),
           ...(typeof plugins === "function" ? [...(await plugins())] : plugins),
           serverFunctions.client({
             runtime: normalize(fileURLToPath(new URL("./server-runtime.jsx", import.meta.url)))
@@ -161,7 +181,17 @@ export function defineConfig(baseConfig = {}) {
         runtime: normalize(fileURLToPath(new URL("./server-fns-runtime.jsx", import.meta.url))),
         // routes: solidStartServerFsRouter({ dir: `${start.appRoot}/routes`, extensions }),
         plugins: async () => [
-          config("user", userConfig),
+          config("user", {
+            ...userConfig,
+            optimizeDeps: {
+              ...(userConfig.optimizeDeps || {}),
+              include: [
+                ...(userConfig.optimizeDeps?.include || []),
+                '@solidjs/start > source-map-js',
+                '@solidjs/start > error-stack-parser',
+              ],
+            },
+          }),
           ...(typeof plugins === "function" ? [...(await plugins())] : plugins),
 
           solid({ ...start.solid, ssr: true, extensions: extensions.map(ext => `.${ext}`) }),

package/config/server-handler.js

@@ -18,10 +18,6 @@ import { provideRequestEvent } from "solid-js/web/storage";
 import invariant from "vinxi/lib/invariant";
 import {
   eventHandler,
-  getHeader,
-  getRequestURL,
-  readBody,
-  readRawBody,
   setHeader
 } from "vinxi/server";
 import { getFetchEvent } from "../server/middleware";
@@ -60,12 +56,14 @@ function serializeToStream(id, value) {
   });
 }
 
-async function handleServerFunction(event) {
-  invariant(event.method === "POST", `Invalid method ${event.method}. Expected POST.`);
+async function handleServerFunction(h3Event) {
+  invariant(h3Event.method === "POST", `Invalid method ${h3Event.method}. Expected POST.`);
+  const event = getFetchEvent(h3Event);
+  const request = event.request;
 
-  const serverReference = getHeader(event, "x-server-id");
-  const instance = getHeader(event, "x-server-instance");
-  const url = getRequestURL(event);
+  const serverReference = request.headers.get("x-server-id");
+  const instance = request.headers.get("x-server-instance");
+  const url = new URL(request.url);
   let filepath, name;
   if (serverReference) {
     invariant(typeof serverReference === "string", "Invalid server function");
@@ -86,22 +84,14 @@ async function handleServerFunction(event) {
     const args = url.searchParams.get("args");
     if (args) JSON.parse(args).forEach(arg => parsed.push(arg));
   }
-  const contentType = getHeader(event, "content-type");
+  const contentType = request.headers.get("content-type");
   if (
     contentType.startsWith("multipart/form-data") ||
     contentType.startsWith("application/x-www-form-urlencoded")
   ) {
-    // Temporary workaround until https://github.com/unjs/nitro/issues/1721 is resolved
-    // parsed.push(await readFormData(event));
-
-    const request = new Request(getRequestURL(event), {
-      method: event.method,
-      headers: event.headers,
-      body: await readRawBody(event)
-    });
     parsed.push(await request.formData());
   } else {
-    parsed = fromJSON(await readBody(event), {
+    parsed = fromJSON(await request.json(), {
       plugins: [
         CustomEventPlugin,
         DOMExceptionPlugin,
@@ -117,17 +107,16 @@ async function handleServerFunction(event) {
     });
   }
   try {
-    const evt = getFetchEvent(event);
-    const result = await provideRequestEvent(evt, () => {
+    const result = await provideRequestEvent(event, () => {
       /* @ts-ignore */
-      sharedConfig.context = { event: evt };
+      sharedConfig.context = { event };
       return action(...parsed);
     });
 
     // handle no JS success case
     if (!instance) {
       const isError = result instanceof Error;
-      const refererUrl = new URL(getHeader(event, "referer"));
+      const refererUrl = new URL(request.headers.get("referer"));
       return new Response(null, {
         status: 302,
         headers: {
@@ -146,7 +135,7 @@ async function handleServerFunction(event) {
       });
     }
     if (typeof result === "string") return new Response(result);
-    setHeader(event, "content-type", "text/javascript");
+    setHeader(h3Event, "content-type", "text/javascript");
     return serializeToStream(instance, result);
   } catch (x) {
     if (x instanceof Response && x.status === 302) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@solidjs/start",
-  "version": "0.4.3",
+  "version": "0.4.5",
   "type": "module",
   "author": "Ryan Carniato",
   "publishConfig": {
@@ -38,7 +38,7 @@
     }
   },
   "devDependencies": {
-    "solid-js": "^1.8.8",
+    "solid-js": "^1.8.9",
     "vinxi": "0.1.1"
   },
   "dependencies": {

package/server/middleware.ts

@@ -2,6 +2,7 @@ import {
   defineMiddleware,
   EventHandlerRequest,
   getRequestIP,
+  getRequestURL,
   H3Event,
   sendWebResponse,
   toWebRequest
@@ -18,9 +19,14 @@ const eventTraps = {
 };
 
 export function createFetchEvent(event: H3Event<EventHandlerRequest>): FetchEvent {
+  event.web ||
+    (event.web = {
+      url: getRequestURL(event),
+      request: toWebRequest(event)
+    });
   return new Proxy(
     {
-      request: toWebRequest(event),
+      request: event.web.request,
       clientAddress: getRequestIP(event),
       locals: {},
       // @ts-ignore

package/server/types.ts

@@ -1,5 +1,5 @@
-import { JSX } from "solid-js";
-import { EventHandlerRequest, H3Event } from "vinxi/server";
+import type { JSX } from "solid-js";
+import type { EventHandlerRequest, H3Event } from "vinxi/server";
 
 // export const FETCH_EVENT = "$FETCH";
 

package/shared/FileRoutes.tsx

@@ -2,7 +2,7 @@
 import { getRequestEvent, isServer } from "solid-js/web";
 import lazyRoute from "./lazyRoute";
 
-import { PageEvent } from "../server";
+import type { PageEvent } from "../server/types";
 import { pageRoutes as routeConfigs } from "./routes";
 
 export function createRoutes() {
@@ -10,7 +10,10 @@ export function createRoutes() {
     return {
       ...route,
       ...(route.$$route ? route.$$route.require().route : undefined),
-      metadata: { ...(route.$$route ? route.$$route.require().route.metadata : {}), filesystem: true },
+      metadata: {
+        ...(route.$$route ? route.$$route.require().route.metadata : {}),
+        filesystem: true
+      },
       component: lazyRoute(
         route.$component,
         import.meta.env.START_ISLANDS

package/shared/dev-overlay/CodeView.tsx

@@ -1,13 +1,29 @@
-import * as shikiji from 'shikiji';
+import type { BuiltinLanguage, Highlighter } from 'shikiji';
+import { getHighlighterCore } from 'shikiji/core';
+import { getWasmInlined } from 'shikiji/wasm';
 import { createEffect, createResource, type JSX } from 'solid-js';
 
-let HIGHLIGHTER: shikiji.Highlighter;
+import langJS from 'shikiji/langs/javascript.mjs';
+import langJSX from 'shikiji/langs/jsx.mjs';
+import langTSX from 'shikiji/langs/tsx.mjs';
+import langTS from 'shikiji/langs/typescript.mjs';
+import darkPlus from 'shikiji/themes/dark-plus.mjs';
+
+let HIGHLIGHTER: Highlighter;
 
 async function loadHighlighter() {
   if (!HIGHLIGHTER) {
-    HIGHLIGHTER = await shikiji.getHighlighter({
-      themes: ['dark-plus'],
-      langs: ['js', 'ts', 'jsx', 'tsx'],
+    HIGHLIGHTER = await getHighlighterCore({
+      themes: [
+        darkPlus,
+      ],
+      langs: [
+        langJS,
+        langJSX,
+        langTS,
+        langTSX,
+      ],
+      loadWasm: getWasmInlined,
     });
   }
   return HIGHLIGHTER;
@@ -44,8 +60,7 @@ export function CodeView(props: CodeViewProps): JSX.Element | null {
       .split(/[#?]/)[0]
       .split('.')
       .pop()
-      ?.trim() as shikiji.BuiltinLanguage;
-    await highlighter.loadLanguage(lang);
+      ?.trim() as BuiltinLanguage;
     return highlighter.codeToHtml(value, {
       theme: 'dark-plus',
       lang,

package/shared/dev-overlay/createStackFrame.ts

@@ -1,4 +1,4 @@
-import { Resource, createResource } from "solid-js";
+import { Accessor, createMemo, createResource } from "solid-js";
 import getSourceMap from "./get-source-map";
 
 export interface StackFrameSource {
@@ -12,10 +12,9 @@ export interface StackFrameSource {
 export function createStackFrame(
   stackframe: StackFrame,
   isCompiled: () => boolean,
-): Resource<StackFrameSource> {
+): Accessor<StackFrameSource> {
   const [data] = createResource(
     () => ({
-      isCompiled: isCompiled(),
       fileName: stackframe.fileName,
       line: stackframe.lineNumber,
       column: stackframe.columnNumber,
@@ -31,27 +30,42 @@ export function createStackFrame(
       }
       const content = await response.text();
       const sourceMap = await getSourceMap(source.fileName, content);
-      if (!source.isCompiled && sourceMap && source.line && source.column) {
-        const result = sourceMap.originalPositionFor({
-          line: source.line,
-          column: source.column,
-        });
-
-        return {
-          ...result,
-          content: sourceMap.sourceContentFor(result.source),
-        };
-      }
-
       return {
-        source: source.fileName,
-        line: source.line,
-        column: source.column,
-        name: source.functionName,
+        source,
         content,
+        sourceMap,
       };
     },
   );
 
-  return data;
+  const info = createMemo<StackFrameSource>(() => {
+    const current = data();
+    if (!current) {
+      return undefined;
+    }
+    const { source, content, sourceMap } = current;
+
+    
+    if (!isCompiled() && source.line && source.column) {
+      const result = sourceMap.originalPositionFor({
+        line: source.line,
+        column: source.column,
+      });
+
+      return {
+        ...result,
+        content: sourceMap.sourceContentFor(result.source),
+      };
+    }
+
+    return {
+      source: source.fileName,
+      line: source.line,
+      column: source.column,
+      name: source.functionName,
+      content,
+    };
+  });
+
+  return info;
 }

package/shared/dev-overlay/styles.css

@@ -27,6 +27,8 @@
   margin-bottom: 2rem;
   z-index: 10;
   gap: 0.5rem;
+  color: rgb(17 24 39);
+  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
 }
 
 .dev-overlay-navbar {
@@ -87,7 +89,6 @@
 }
 
 .dev-overlay-page-counter {
-  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
   font-size: 0.875rem;
   line-height: 1.25rem;
   font-weight: 600;
@@ -120,7 +121,6 @@
   border-radius: 9999px;
   background-color: rgb(249 250 251);
   padding: 0.25rem 0.5rem;
-  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
   font-size: 0.875rem;
   line-height: 1.25rem;
   font-weight: 600;
@@ -146,7 +146,6 @@
 }
 
 .dev-overlay-error-info {
-  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
   display: flex;
   flex-direction: column;
   gap: 0.25rem;
@@ -208,7 +207,6 @@
 }
 
 .dev-overlay-stack-frame-function {
-  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
   font-weight: 700;
 }
 
@@ -245,7 +243,6 @@
 .dev-overlay-stack-frames-code-source {
   font-size: 0.875rem;
   line-height: 1.25rem;
-  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
   color: rgb(249 250 251);
 }