solidjs / solid-start Goto Github PK

View Code? Open in Web Editor NEW

4.5K 45.0 350.0 13.21 MB

SolidStart, the Solid app framework

Home Page: https://start.solidjs.com

License: MIT License

JavaScript 3.81% TypeScript 34.75% CSS 2.35% SCSS 4.24% HTML 54.85%

meta-framework solid-js ssr file-system-routing sdk spa

solid-start's Introduction

SolidStart

SolidStart has just entered a new Release Candidate Phase

v0.4.x marked a significant change in the project. Please check the updated docs and example projects to see how things have changed. A summary of the changes can be found in the RFC.

This is the home of the SolidStart, the Solid app framework.

Features

File-system based routing
Supports all rendering modes:
- Server-side rendering (SSR)
- Streaming SSR
- Client-side rendering (CSR)
- Static site generation (SSG)
Streaming
Build optimizations with code splitting, tree shaking and dead code elimination
API Routes
Built on Web standards like Fetch, Streams, and WebCrypto
Adapters for deployment to all popular platforms
CSS Modules, SASS/SCSS Support
TypeScript-first

Getting started

Create a SolidStart application and run a development server using your preferred package manager:

mkdir my-app
cd my-app

# with npm
npm init solid@latest
npm install
npm run dev

# or with pnpm
pnpm create solid@latest
pnpm install
pnpm dev

# or with Bun
bun create solid@latest
bun install
bun run dev

Development

You should use a Node.js version manager compatible with .node-version (asdf-vm is a great option macOS/Linux users)

The monorepo uses pnpm as the package manager. To install pnpm, run the following command in your terminal.

npm install -g pnpm

Run pnpm install to install all the dependencies for the packages and examples in your monorepo.

Run pnpm build to build SolidStart project

Monorepo & `project.json` `"workspace"` support

If you are using SolidStart within a monorepo that takes advantage of the package.json "workspaces" property (e.g. Yarn workspaces) with hoisted dependencies (the default for Yarn), you must include #solidjs/start within the optional "nohoist" (for Yarn v2 or higher, see further down for instructions) workspaces property.

In the following, "workspace root" refers to the root of your repository while "project root" refers to the root of a child package within your repository.

For example, if specifying "nohoist" options from the workspace root (i.e. for all packages):

// in workspace root
{
  "workspaces": {
    "packages": [
      /* ... */
    ],
    "nohoist": ["**/@solidjs/start"]
  }
}

If specifying "nohoist" options for a specific package using @solidjs/start:

// in project root of a workspace child
{
  "workspaces": {
    "nohoist": ["@solidjs/start"]
  }
}

Regardless of where you specify the nohoist option, you also need to include @solidjs/start as a devDependency in the child package.json.

The reason why this is necessary is because @solidjs/start creates an index.html file within your project which expects to load a script located in /node_modules/@solidjs/start/runtime/entry.jsx (where / is the path of your project root). By default, if you hoist the @solidjs/start dependency into the workspace root then that script will not be available within the package's node_modules folder.

Yarn v2 or higher

The nohoist option is no longer available in Yarn v2+. In this case, we can use the installConfig property in the package.json (either workspace package or a specific project package) to make sure our deps are not hoisted.

// in project root of a workspace child
{
  "installConfig": {
    "hoistingLimits": "dependencies"
  }
}

solid-start's People

Contributors

Stargazers

Watchers

Forkers

jorroll cwspear rrosas1198 hribb vsbyvi jceb thdxr dkkloimwieder lxsmnsyc qoddiapps russelgal davedbase advtechnoking devinxi fictitious btakita emme1444 mrfoxpro skyblueballykid zachiah samwightt enteleform-forks tydira lawrencecchen amorriscode oliverloops divmgl m4rvr acerempel atk modderme123 arksun-bc ch99q dileepreddyp katywings tootallnate ghalle ollivr palbahngmiyine lukesheard lpturmel devsmitra boehs alxarch ehsanonline cooloppo olgam4 cstrnt g3root adrlano mositori benbender pheggeseth juliesaia godgodwinter taymoork2 nimaear shahriar-shojib lightyaer harshmangalam priestch samcfinan yusufsafak markdalgleish am1rarsalan ddpn08 fdemir ryanflorence makyfj cohenerickson fabian-hiller linecode zalexios wangz-code nnmykn yonran kaushalyap arstnei0 masteramarjeet juanrgm alexerrant patdx pawelblaszczyk5 skreutzberger marko154 spicyzboss vanillacode314 maksimsemenov tanner-scadden charca mhyfritz dev-rb rpivo lenniezelk paoloricciuti ckgrafico nullablevoidptr quentindutot antivixen edivados

solid-start's Issues

createRequest should pass Request body for PUT & PATCH http calls, similar to POST

If the HTTP verb begins with a P, then it has a Request body.

StartContext missing from import 'solid-start/components'

StartContext is not included in index.tsx

solid-start build: Error: 'ssrBoolean' is not exported by .../solid-js/web/dist/server.js, imported by .solid/server/app.js

When running solid-start build, I'm getting the error:

Error: 'ssrBoolean' is not exported by ../../node_modules/.pnpm/[email protected]/node_modules/solid-js/web/dist/server.js, imported by .solid/server/app.js

It looks like ssrBoolean is not defined in the dom-expressions package, yet is defined in solidjs server-mock.ts.

Top-level index data function does not get executed

A top-level index data function (i.e. pages/index.data.js) does not get executed.

This is because the identifier in the data lookup table is / while findNestedPath gets called with an empty string as id.

Build failed when use pnpm install

Hi, there is an issue when use pnpm.

Steps:

npm init solid@next

It will outputs:

Next steps:
  1: npm install (or pnpm install, or yarn)
  2: npm run dev -- --open

Then run pnpm install && pnpm run build, it will output 'node-fetch' is imported by .solid/server/index.js, but could not be resolved:

➜  solid-pnpm pnpm run build

> solid-pnpm@ build /Users/owenyoung/inbox/solid-pnpm
> solid-start build

vite v2.5.10 building for production...
vite v2.5.10 building SSR bundle for production...
✓ 27 modules transformed.
✓ 25 modules transformed.
.solid/server/rmanifest.json   0.08 KiB
.solid/server/manifest.json    0.24 KiB
.solid/server/nodeStream.js    25.36 KiB
dist/rmanifest.json              0.26 KiB
dist/manifest.json               0.51 KiB
dist/assets/index.4675620e.js    0.62 KiB / brotli: 0.31 KiB
dist/assets/index.02b9559a.css   0.67 KiB / brotli: 0.32 KiB
dist/assets/client.b4785e53.js   20.59 KiB / brotli: 7.10 KiB
'node-fetch' is imported by .solid/server/index.js, but could not be resolved

I also try npm install, it works fine.

Support for next middleware function

This will allow the solid-start middleware to be bypassed to the next middleware.

entry-server can take a next param which will enable it to move to the next middleware.

pnpm build && pnpm start - TypeError: Cannot read properties of undefined (reading 'default')

The route jsx files are transpiled after the const routes = $ROUTES; routes definition. Explicitly importing the routes tsx files before importing Routes fixes the issue.

  p.then(mod => resolved = mod.default);

TypeError: Cannot read properties of undefined (reading 'default')

windows: route path mismatch with manifest

this is what manifest looks like on windows in getAssetsFromManifest :

getAssetsFromManifest: route= [ { originalPath: '/', pattern: '', path: '/', params: {} } ]
manifest:  {
  '/C:/Users/me/src/test-solid-start/2022-01-23/src': [
    { type: 'script', href: '/assets/index.1ce99872.js' },
    { type: 'script', href: '/assets/client.99f63873.js' },
    { type: 'style', href: '/assets/index.adcc5497.css' }
  ],
  '*': [ { type: 'script', href: '/assets/client.99f63873.js' } ]
}

that C:/Users/.. path is just '/' on linux

as a result, on windows, no script and style tags are added to the <head>

SSR issue with solidjs package built with "rollup-preset-solid"

I'm trying to use solid-scroll-shadows package with SSR and it fails.

Here's the repo to replicate https://github.com/aquaductape/test-scroll-shadows. File/Page where solid-scroll-shadows is being used https://github.com/aquaductape/test-scroll-shadows/blob/main/src/routes/index.tsx

I suspect it's a package output issue because I copied the library into the repo https://github.com/aquaductape/test-scroll-shadows/tree/main/src/lib/solid-scroll-shadows, and used it instead of using the official package and it works.

// import ScrollShadows from "solid-scroll-shadows";
import ScrollShadows from "../lib/solid-scroll-shadows";

dev log "npm run dev"

2:29:28 AM [vite] Error when evaluating SSR module /src/routes/index.tsx:
file:///Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/solid-scroll-shadows/dist/esm/index.js:1
import { template, effect, style, insert, createComponent, isServer, classList } from 'solid-js/web';
                                                                     ^^^^^^^^^
SyntaxError: The requested module 'solid-js/web' does not provide an export named 'classList'
    at ModuleJob._instantiate (node:internal/modules/esm/module_job:124:21)
    at async ModuleJob.run (node:internal/modules/esm/module_job:181:5)
    at async Promise.all (index 0)
    at async ESMLoader.import (node:internal/modules/esm/loader:281:24)
    at async importModuleDynamicallyWrapper (node:internal/vm/module:437:15)
    at async nodeImport (/Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/vite/dist/node/chunks/dep-9c153816.js:56262:21)
    at async eval (/src/routes/index.tsx:19:31)
    at async instantiateModule (/Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/vite/dist/node/chunks/dep-9c153816.js:56193:9)
2:29:28 AM [vite] Error when evaluating SSR module /node_modules/solid-start/root/Routes.tsx:
file:///Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/solid-scroll-shadows/dist/esm/index.js:1
import { template, effect, style, insert, createComponent, isServer, classList } from 'solid-js/web';
                                                                     ^^^^^^^^^
SyntaxError: The requested module 'solid-js/web' does not provide an export named 'classList'
    at ModuleJob._instantiate (node:internal/modules/esm/module_job:124:21)
    at async ModuleJob.run (node:internal/modules/esm/module_job:181:5)
    at async Promise.all (index 0)
    at async ESMLoader.import (node:internal/modules/esm/loader:281:24)
    at async importModuleDynamicallyWrapper (node:internal/vm/module:437:15)
    at async nodeImport (/Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/vite/dist/node/chunks/dep-9c153816.js:56262:21)
    at async eval (/src/routes/index.tsx:19:31)
    at async instantiateModule (/Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/vite/dist/node/chunks/dep-9c153816.js:56193:9)
2:29:28 AM [vite] Error when evaluating SSR module /node_modules/solid-start/root/index.tsx:
file:///Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/solid-scroll-shadows/dist/esm/index.js:1
import { template, effect, style, insert, createComponent, isServer, classList } from 'solid-js/web';
                                                                     ^^^^^^^^^
SyntaxError: The requested module 'solid-js/web' does not provide an export named 'classList'
    at ModuleJob._instantiate (node:internal/modules/esm/module_job:124:21)
    at async ModuleJob.run (node:internal/modules/esm/module_job:181:5)
    at async Promise.all (index 0)
    at async ESMLoader.import (node:internal/modules/esm/loader:281:24)
    at async importModuleDynamicallyWrapper (node:internal/vm/module:437:15)
    at async nodeImport (/Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/vite/dist/node/chunks/dep-9c153816.js:56262:21)
    at async eval (/src/routes/index.tsx:19:31)
    at async instantiateModule (/Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/vite/dist/node/chunks/dep-9c153816.js:56193:9)
2:29:28 AM [vite] Error when evaluating SSR module /src/root.tsx:
file:///Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/solid-scroll-shadows/dist/esm/index.js:1
import { template, effect, style, insert, createComponent, isServer, classList } from 'solid-js/web';
                                                                     ^^^^^^^^^
SyntaxError: The requested module 'solid-js/web' does not provide an export named 'classList'
    at ModuleJob._instantiate (node:internal/modules/esm/module_job:124:21)
    at async ModuleJob.run (node:internal/modules/esm/module_job:181:5)
    at async Promise.all (index 0)
    at async ESMLoader.import (node:internal/modules/esm/loader:281:24)
    at async importModuleDynamicallyWrapper (node:internal/vm/module:437:15)
    at async nodeImport (/Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/vite/dist/node/chunks/dep-9c153816.js:56262:21)
    at async eval (/src/routes/index.tsx:19:31)
    at async instantiateModule (/Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/vite/dist/node/chunks/dep-9c153816.js:56193:9)
2:29:28 AM [vite] Error when evaluating SSR module /node_modules/solid-start/entry-server/StartServer.tsx:
file:///Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/solid-scroll-shadows/dist/esm/index.js:1
import { template, effect, style, insert, createComponent, isServer, classList } from 'solid-js/web';
                                                                     ^^^^^^^^^
SyntaxError: The requested module 'solid-js/web' does not provide an export named 'classList'
    at ModuleJob._instantiate (node:internal/modules/esm/module_job:124:21)
    at async ModuleJob.run (node:internal/modules/esm/module_job:181:5)
    at async Promise.all (index 0)
    at async ESMLoader.import (node:internal/modules/esm/loader:281:24)
    at async importModuleDynamicallyWrapper (node:internal/vm/module:437:15)
    at async nodeImport (/Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/vite/dist/node/chunks/dep-9c153816.js:56262:21)
    at async eval (/src/routes/index.tsx:19:31)
    at async instantiateModule (/Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/vite/dist/node/chunks/dep-9c153816.js:56193:9)
2:29:28 AM [vite] Error when evaluating SSR module /node_modules/solid-start/entry-server/index.ts?v=ddf2b99f:
file:///Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/solid-scroll-shadows/dist/esm/index.js:1
import { template, effect, style, insert, createComponent, isServer, classList } from 'solid-js/web';
                                                                     ^^^^^^^^^
SyntaxError: The requested module 'solid-js/web' does not provide an export named 'classList'
    at ModuleJob._instantiate (node:internal/modules/esm/module_job:124:21)
    at async ModuleJob.run (node:internal/modules/esm/module_job:181:5)
    at async Promise.all (index 0)
    at async ESMLoader.import (node:internal/modules/esm/loader:281:24)
    at async importModuleDynamicallyWrapper (node:internal/vm/module:437:15)
    at async nodeImport (/Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/vite/dist/node/chunks/dep-9c153816.js:56262:21)
    at async eval (/src/routes/index.tsx:19:31)
    at async instantiateModule (/Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/vite/dist/node/chunks/dep-9c153816.js:56193:9)
2:29:28 AM [vite] Error when evaluating SSR module /Users/caleb/Documents/just-programming/test-scroll-shadows/src/entry-server:
file:///Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/solid-scroll-shadows/dist/esm/index.js:1
import { template, effect, style, insert, createComponent, isServer, classList } from 'solid-js/web';
                                                                     ^^^^^^^^^
SyntaxError: The requested module 'solid-js/web' does not provide an export named 'classList'
    at ModuleJob._instantiate (node:internal/modules/esm/module_job:124:21)
    at async ModuleJob.run (node:internal/modules/esm/module_job:181:5)
    at async Promise.all (index 0)
    at async ESMLoader.import (node:internal/modules/esm/loader:281:24)
    at async importModuleDynamicallyWrapper (node:internal/vm/module:437:15)
    at async nodeImport (/Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/vite/dist/node/chunks/dep-9c153816.js:56262:21)
    at async eval (/src/routes/index.tsx:19:31)
    at async instantiateModule (/Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/vite/dist/node/chunks/dep-9c153816.js:56193:9)
ERROR file:///Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/solid-scroll-shadows/dist/esm/index.js:1
import { template, effect, style, insert, createComponent, isServer, classList } from 'solid-js/web';
                                                                     ^^^^^^^^^
SyntaxError: The requested module 'solid-js/web' does not provide an export named 'classList'
    at ModuleJob._instantiate (node:internal/modules/esm/module_job:124:21)
    at async ModuleJob.run (node:internal/modules/esm/module_job:181:5)
    at async Promise.all (index 0)
    at async ESMLoader.import (node:internal/modules/esm/loader:281:24)
    at async importModuleDynamicallyWrapper (node:internal/vm/module:437:15)
    at async nodeImport (/Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/vite/dist/node/chunks/dep-9c153816.js:56262:21)
    at async eval (/src/routes/index.tsx:19:31)
    at async instantiateModule (/Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/vite/dist/node/chunks/dep-9c153816.js:56193:9)

build log "npm run build"

file:///Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/rollup/dist/es/shared/rollup.js:1784
        base = Object.assign(new Error(base.message), base);
                             ^

Error: Could not resolve './components/ScrollShadows/ScrollShadows' from node_modules/solid-scroll-shadows/dist/source/index.jsx
    at error (file:///Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/rollup/dist/es/shared/rollup.js:1784:30)
    at ModuleLoader.handleResolveId (file:///Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/rollup/dist/es/shared/rollup.js:22285:24)
    at file:///Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/rollup/dist/es/shared/rollup.js:22248:26 {
  code: 'UNRESOLVED_IMPORT',
  watchFiles: [
    '/Users/caleb/Documents/just-programming/test-scroll-shadows/.solid/server/index.js',
    '/Users/caleb/Documents/just-programming/test-scroll-shadows/dist/rmanifest.json',
    '/Users/caleb/Documents/just-programming/test-scroll-shadows/dist/manifest.json',
    '/Users/caleb/Documents/just-programming/test-scroll-shadows/.solid/server/app.js',
    '/Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/solid-start-node/server.js',
    '/Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/solid-start/runtime/prepareManifest.js',
    '/Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/solid-start/runtime/fetch.js',
    '/Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/solid-scroll-shadows/dist/source/index.jsx',
    '/Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/solid-js/dist/server.js',
    '/Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/solid-js/web/dist/server.js',
    '/Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/polka/build.mjs',
    '/Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/sirv/build.mjs',
    '/Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/compression/index.js',
    '/Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/parse-multipart-data/dist/multipart.js',
    '\x00commonjsHelpers.js',
    '\x00/Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/compression/index.js?commonjs-module',
    '\x00/Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/parse-multipart-data/dist/multipart.js?commonjs-exports',
    '/Users/caleb/Documents/just-programming/test-scroll-shadows/node_modules/solid-scroll-shadows/dist/source/plugins/shadowMask.js'
  ]
}

Support router integrations of solid-app-router

example usage: src/entry-client.tsx

import { render } from "solid-js/web";
import { hashIntegration } from "solid-app-router";
import { StartClient } from "solid-start/entry-client";

render(() => <StartClient routerIntergration={hashIntegration}  />, document.body);

example change: packages/start/entry-client/StartClient.tsx

import { MetaProvider } from "solid-meta";
import { Router } from "solid-app-router";
import { StartProvider } from "../entry-server/StartContext";
import Root from "~/root";

const rootData = Object.values(import.meta.globEager("/src/root.data.(js|ts)"))[0];
const dataFn = rootData ? rootData.default : undefined;

// typeof routerIntergration = RouterIntegration | undefined
// TODO: validate routerIntergration

export default ({ routerIntergration }) => {
  return (
    <StartProvider>
      <MetaProvider>
        <Router source={routerIntergration && routerIntergration()} data={dataFn}>
          <Root />
        </Router>
      </MetaProvider>
    </StartProvider>
  );
};

I hardcoded hashIntegration from the above solution, the outcome looks good to me

is hackernews-ts exemple run in default ?

I got this error at build

$ npm run build

> build
> solid-start build

(node:8785) ExperimentalWarning: stream/web is an experimental feature. This feature could change at any time
(Use `node --trace-warnings ...` to show where the warning was created)
vite v2.7.13 building for production...
transforming (24) node_modules/solid-app-router/dist/integration.jsError when using sourcemap for reporting an error: Can't resolve original location of error.
✓ 30 modules transformed.
'innerHTML' is not exported by node_modules/solid-js/web/dist/web.js, imported by src/components/comment.tsx
file: /Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/src/components/comment.tsx:3:9
1: import { template as _$template } from "solid-js/web";
2: import { delegateEvents as _$delegateEvents } from "solid-js/web";
3: import { innerHTML as _$innerHTML } from "solid-js/web";
            ^
4: import { effect as _$effect } from "solid-js/web";
5: import { getNextElement as _$getNextElement } from "solid-js/web";
/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/node_modules/rollup/dist/shared/rollup.js:160
        base = Object.assign(new Error(base.message), base);
                             ^

Error: 'innerHTML' is not exported by node_modules/solid-js/web/dist/web.js, imported by src/components/comment.tsx
    at error (/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/node_modules/rollup/dist/shared/rollup.js:160:30)
    at Module.error (/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/node_modules/rollup/dist/shared/rollup.js:12438:16)
    at Module.traceVariable (/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/node_modules/rollup/dist/shared/rollup.js:12808:29)
    at ModuleScope.findVariable (/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/node_modules/rollup/dist/shared/rollup.js:11601:39)
    at ReturnValueScope.findVariable (/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/node_modules/rollup/dist/shared/rollup.js:6964:38)
    at ChildScope.findVariable (/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/node_modules/rollup/dist/shared/rollup.js:6964:38)
    at ReturnValueScope.findVariable (/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/node_modules/rollup/dist/shared/rollup.js:6964:38)
    at ChildScope.findVariable (/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/node_modules/rollup/dist/shared/rollup.js:6964:38)
    at ReturnValueScope.findVariable (/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/node_modules/rollup/dist/shared/rollup.js:6964:38)
    at Identifier.bind (/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/node_modules/rollup/dist/shared/rollup.js:6479:40) {
  code: 'MISSING_EXPORT',
  url: 'https://rollupjs.org/guide/en/#error-name-is-not-exported-by-module',
  id: '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/src/components/comment.tsx',
  pos: 131,
  loc: {
    column: 9,
    file: '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/src/components/comment.tsx',
    line: 3
  },
  frame: '1: import { template as _$template } from "solid-js/web";\n' +
    '2: import { delegateEvents as _$delegateEvents } from "solid-js/web";\n' +
    '3: import { innerHTML as _$innerHTML } from "solid-js/web";\n' +
    '            ^\n' +
    '4: import { effect as _$effect } from "solid-js/web";\n' +
    '5: import { getNextElement as _$getNextElement } from "solid-js/web";',
  watchFiles: [
    '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/src/entry-client.tsx',
    '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/node_modules/solid-js/web/package.json',
    '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/node_modules/solid-start/package.json',
    '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/node_modules/solid-js/web/dist/web.js',
    '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/node_modules/solid-start/components/index.tsx',
    '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/node_modules/solid-start/components/Links.tsx',
    '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/node_modules/solid-start/components/Meta.tsx',
    '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/node_modules/solid-start/components/Routes.tsx',
    '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/node_modules/solid-start/components/Scripts.tsx',
    '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/node_modules/solid-start/components/StartClient.tsx',
    '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/node_modules/solid-start/components/StartContext.tsx',
    '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/node_modules/solid-start/components/StartServer.tsx',
    '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/node_modules/solid-js/package.json',
    '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/node_modules/solid-js/dist/solid.js',
    '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/node_modules/solid-app-router/package.json',
    '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/node_modules/solid-app-router/dist/index.jsx',
    '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/src/routes/[...stories].tsx?data',
    '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/src/routes/stories/[id].tsx?data',
    '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/src/routes/users/[id].tsx?data',
    '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/src/routes/[...stories].tsx',
    '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/src/routes/stories/[id].tsx',
    '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/src/routes/users/[id].tsx',
    '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/node_modules/solid-meta/package.json',
    '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/node_modules/solid-meta/dist/index.jsx',
    '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/src/root.tsx',
    '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/node_modules/solid-start/server/index.ts',
    '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/src/components/story.tsx',
    '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/src/components/comment.tsx',
    '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/src/components/nav.tsx',
    '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/src/root.css',
    '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/node_modules/solid-app-router/dist/components.jsx',
    '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/node_modules/solid-app-router/dist/integration.js',
    '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/node_modules/solid-app-router/dist/routing.js',
    '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/node_modules/solid-app-router/dist/utils.js',
    '/Users/efxair/Desktop/dev/solidtuts/hacker-news-solid-start/node_modules/solid-start/server/constants.js'
  ]
}

The npm run dev has some troubles too.

regression: npm run dev --port $PORT

npm run dev --port 4000 spawns the dev server on port 3000

'merge-anything' does not provide an export named 'mergeAndConcat'

Describe the bug
The dev server successfully opens a new tab with the default address/port (http://localhost:3000/ in this case), however, it almost immediately crashes with the following error:

Taros-MBP:<DIR_NAME> potatopotaro$ pnpm run dev -- --open

> <DIR_NAME>@ dev /Users/potatopotaro/Documents/projects/<DIR_NAME>
> solid-start dev "--open"

failed to load config from /Users/potatopotaro/Documents/projects/<DIR_NAME>/vite.config.js
(node:1533) UnhandledPromiseRejectionWarning: file:///Users/potatopotaro/Documents/projects/<DIR_NAME>/node_modules/.pnpm/[email protected]/node_modules/vite-plugin-solid/dist/esm/index.mjs:5
import { mergeAndConcat } from 'merge-anything';
         ^^^^^^^^^^^^^^
SyntaxError: The requested module 'merge-anything' does not provide an export named 'mergeAndConcat'
    at ModuleJob._instantiate (internal/modules/esm/module_job.js:92:21)
    at async ModuleJob.run (internal/modules/esm/module_job.js:107:20)
    at async Loader.import (internal/modules/esm/loader.js:179:24)
    at async importModuleDynamicallyWrapper (internal/vm/module.js:432:15)
    at async loadConfigFromFile (/Users/potatopotaro/Documents/projects/<DIR_NAME>/node_modules/.pnpm/[email protected]/node_modules/vite/dist/node/chunks/dep-6e02b235.js:46235:31)
    at async resolveConfig (/Users/potatopotaro/Documents/projects/<DIR_NAME>/node_modules/.pnpm/[email protected]/node_modules/vite/dist/node/chunks/dep-6e02b235.js:45889:28)
    at async Object.createServer (/Users/potatopotaro/Documents/projects/<DIR_NAME>/node_modules/.pnpm/[email protected]/node_modules/vite/dist/node/chunks/dep-6e02b235.js:69129:20)
    at async createServer (file:///Users/potatopotaro/Documents/projects/<DIR_NAME>/node_modules/.pnpm/[email protected]_db9a126b6b31f1a7a79b257c7dace278/node_modules/solid-start/runtime/devServer.js:10:18)

To Reproduce

Install/initialize a fresh project using npm init solid@next
Run the dev server with pnpm run dev (occurs with the use of npm and -- --open arg as well)
Notice a tab is opened, prefilled with the default localhost + port
Also notice how the dev command/script crashes with the above error.

Expected behavior
The dev script successfully/continuously runs until stopped by the developer.

Additional context
My gut says this is a problem on my end, as you would've likely caught the error already, otherwise. I'll update this issue with the solution if I find it.

Feature request: type safety for RPCs

I think that having type safe RPCs to maintain full type safety between the server and the client would be nice.
From the latest example I could find it doesn't seem like this feature exists currently.
We can probably look at tRPC and Blitz for inspiration.

How to use cloudflare adapter?

I have build a simple site with solid start & need to deploy it in to cloudflare workers!
I have installed the solid-start-cloudflare-workers packages & set it as an adapter in vite.config.js as an adapter! When I try to build the project, it fails with these error.

How can I fix these problem?

solid-start-static (SSG) not work

Changing the adapter to "solid-start-static" causes the error:

node:fs:1722
  handleErrorFromBinding(ctx);

StartContext generic type does not match entryServer types

It should be:

export const StartContext = createContext<{
  manifest?: Record<string, any>;
  context?: Record<string, any>;
}>({});

Cannot find package 'stream' on new install

Hi, I was trying to do a base install of solid-start following the instructions in the readme :

mkdir my-app
cd my-app
npm init solid@next
npm install
npm run dev

Unfortunately, after running the npm run dev command I receive the error UnhandledPromiseRejectionWarning: Error [ERR_MODULE_NOT_FOUND]: Cannot find package 'stream' imported from /Users/{user}/projects/my-app/node_modules/solid-start/runtime/node-globals.js

Can anyone advise how I might resolve?

I'm using Node v14.19.0 and NPM v6.14.16, I've tried cleaning and re-installing a couple of times to see if it resolved, also with cleaning npm cache but it's not helped.

The Server function is not working when routing back

I am using Solid Start with the server function to fetch a data from a Swapi API & I see that the server function works in a dev mode, but after deploying the App to Cloudflare workers, it seems broken.
In the Fist Load of the App I didn't see any errors, but when routing to about page & routing back to home page, its fails returning ugly HTML. when I see it in network tab preview window, I see these thing. It's an issue in Cloudflare Workers or in Solid Start? Note, that it works when I remove the server function & Also I am getting these error after alpha 61.

https://swapi.zeamanuel.workers.dev/
https://github.com/ZeAmanuel28/Solid-Swapi

Add a library mode / packaging

Hi,
It would be nice to have an option like the sveltekit package to allow people to create library without the pain to configure rollup or vite build config, add .d.ts files etc...

Any thoughts of utilizing snowpack(vs vite)?

Hello.
Maybe this is more of a discussion question, but I'd like to mention it. Though this may be used as a recommendation to enable discussions here. I might of went into the discord channels, but still don't have such an account.

So, have you thought of using one of the more-promising imho snowpack unbundling build tool for the improvement of the solid starter? As to how I understand the diffs between snowpack and others, it offers more modern approach to setting up dev environment and for the actual builds, it can be made utilize only simpler and efficient esbuild without relying on prev-gen rollup/webpack stuff. Snowpack v3.0.

I personally am eager to delve into making a flexible ground for developing mixedly(i.e. browser+server)- rendered apps with multipage support and find the solidjs project as a step forward in that direction. So I hope its tooling could be kept up-to-date with the good js-stuff that's out there.

Cheers,
Kostadin

During hydration, `<!DOCTYPE html>` is deleted, which leads to an error in lighthouse

lighthouse

When will the SSR CLI be ready for production

The mobile terminal rating requirements are very high.
I'm going to migrate from NextJS to SolidJS.

Actions are sent to client

This is more of a question, but I was assuming actions are server-only and are not sent to the client. Currently they are, however, and I am getting errors as I am importing Node-only modules.

Is this a bug?

@vite/client:351 error when running distribution build and accessing a 404 path

Steps to reproduce:

npm init solid@next
npm install
npm build

the to start the server
npm run start or cd dist; node index.js

Default paths and any added pages work fine
access any path without a page, action, or data file defined

Error rendered to the browser: Cannot read property 'reduce' of undefined
Error rendered to console: Failed to load resource: the server responded with a status of 500 (Internal Server Error)

A deeper scan seems to reveal it's a Vite error @vite/client:351 and 352 line ref - looks like it's trying to access the route remotely and of getting a 500 status code <- I could be wrong.

The weird thing is this only occurs in a production build, it works fine in dev mode.

Finally, could not see if a default 404 page gets generated for bad paths, or if a 404 in pages dir would be used by default for any paths that do not exist clientside or are exposed to the client serverside via actions?

config.solidOptions is undefined when using pnpm

/node_modules/.pnpm/[email protected][email protected]/node_modules/solid-start-node/index.js:9
  const { preferStreaming } = config.solidOptions;
                                     ^

TypeError: Cannot read properties of undefined (reading 'solidOptions')

The error only occurs when using pnpm (shamefully-hoist=true does not fix the error). Dev server works the same as npm / yarn

Load only Compiled JS for the specific page.

It would be nice to have a feature where only the xx.data.js + its page xx.jsx are loaded for requested page instead of having the whole js of the pages in one file bundle.

Observation from: http://solidjs.github.io/solid-hackernews

Same for css

Files in public folder in build (Node Adapter)

Hello, we deployed new application using solid-start and after doing npm run build, we cannot open files in /public folder. It always gives us fallback route index.js. What could be the cause? We checked other examples (like hackernews-ts) and did not find any difference.

Create an adapter for cloudflare Pages

My client side rendered solid.js App was hosted on cloudflare pages which is a static sites hosting platform. It's really cool that it gives a git based deployment, production & staging environments, real time site analytics, unlimited bandwidth & edge funtions by integrating workers in to it & also short domain project_name.pages.dev.

When I try to build that same App with Solid Start, I noticed that I can't host it on cloudflare pages because it's needs an ssr. But cloudflare pages also supports ssr by making a funtions/[[path]].ts files & implement the ssr code in it or import a workers ssr logic into it.

https://blog.cloudflare.com/cloudflare-pages-goes-full-stack/
https://blog.cloudflare.com/remix-on-cloudflare-pages/
https://developers.cloudflare.com/pages/platform/functions

You Can see these links to know more about it.
It will be so much similar with the cloudflare adapter the only difference will be the functions folder & the static files storage will not be in kv store, so please implement an adapter for cloudflare pages.

Routing not working correctly

If you create two files in the pages folder, Pagination and PaginationNav, navigating to either one will show an empty page, and not render the appropriate route. Removing one of the files causes the remaining page to render properly. You can easily repro by using npm init solid@next and adding two pages with a simple function to each.

I just did the above, but using solid-js 1.2.5 (as I am on windows, as per #29), and solid-start 0.1.0-alpha.44 due to solid-js dependency resolution.

Make a Cloudflare Page Adapter

Documentation for separate imports for client/server bundle

Obviously this package is a WIP, but as an eventual documentation (or maybe feature) request:

Having some guidance on how to load different code on the server vs on the client would be helpful. Vite has a generic mechanism for adding conditional SSR logic, but that method won't work for switching out static imports on the client vs the server (e.g. providing a client version of a service on the client and a server version of a service on the server). Angular CLI handles this by allowing the user to specify file replacements per build environment (e.g. dev vs prod vs test).

Vite has instructions for creating a conditional config based on the build settings, unfortunately this doesn't appear to help (in development at least) because the config is only called once with the following environment object: { mode: 'development', command: 'serve' }. As such, it doesn't appear possible to use this feature to provide a file replacement pattern just for the server build.

It seems possible that this is a feature request for the solid-start plugin.

Alternative ways to define/instantiate adapters (Bring-Your-Own-Adapter)

Currently, from what I can see, the adapters seem to be semi-limited to what is provided here in the solid-start repro (Edit: Custom adaptors are currently possible, however, imports/dependencies are a little tricky). I'm sure Ryan and contributors have inspected every inch of SvelteKit and have noticed how they handle adapter specification, e.g.:

// svelte.config.cjs
const node = require('@sveltejs/adapter-node');

module.exports = {
	kit: {
		adapter: node()
	}
};

Are there any plans to implement a similar solution? I ask because I'd like to customize my cloudflare-worker deployment with template predefined in memory, along with a few other changes. Eventually, I may open a PR here when I feel like I've matured my implementation.

Additionally, is this adapter architecture and conceptualization the best approach to handle deployments for various targets/environments? I have a hunch that many developers would like to modify their serving logic (in addition to the conventions laid out in adapters) and neither the current string implementation nor SvelteKit's adapter specification lends themselves well to such a scenario.

I believe the ideal developer experience (DX) would involve using the solid-start CLI to generate server logic in a file(s), from which devs can modify how they see fit. Likely the biggest pain point with this approach would be version management/diffing when trying to upgrade the server logic to a new release (if there were changes made from the developer/user).

There are of course other caveats to this but I believe it would be a superior DX, even to SvelteKit's adapter spec, as it would be much easier to pick and choose what logic users/devs would like to extend from first-party adapters. Currently, extending a SvelteKit adapter involves wrapping their constructors, a process that involves less transparency/clarity than writing directly to a file(s) containing server logic.

CF Workers: Unpredictable behavior when dynamically storing `template` in memory

The template variable within entry-stream.js can be stale, which will lead to very odd behavior upon uploading changes to CF Workers KV (while an instance of template is instantiated).

// solid-start-cloudflare-workers/entry-stream.js
// ...
let template;
// ...
async function handleEvent(event) {
    // ...
    if (!template) { // <=== Can be stale if worker's template is updated AND already in memory
      template = await __STATIC_CONTENT.list({prefix: "index"})
        .then(res => __STATIC_CONTENT.get(res.keys[0].name));
    }
    // ...
}

An easy repro is:

Successfully create and run a fresh solid-start + CF worker project with wrangler dev.
Add a single character to the end of your title in the index.html vite entry (for example, "!").
Build your project once again, follow it with wrangler dev.
Notice the large body of text (stringified JS script) that is returned + strange network requests.

`create-solid` does not support monorepo with yarn workspaces and hoisted deps

Using create-solid to setup a new project within a monorepo that uses yarn workspaces and hoisted dependencies (which is the default) does not appear to work.

See reproduction here:

https://gitlab.com/john.carroll.p/solidstart-monorepo-issue

Running yarn install and then yarn dev results in the following warning and the app does not serve

You appear to have multiple instances of Solid. This can lead to unexpected behavior.
computations created outside a `createRoot` or `render` will never be disposed

Usage within a monorepo without hoisted dependencies seems to work fine. However, I would like for all projects within the repo to use the same solidjs dependency.

npm Workspaces

Testing with npm v7 workspaces also seems to have the same error, though I'm less familiar with npm workspaces so it's unclear if they are expected to work similarly to yarn workspaces.

Child routes under root

Is it possible to have child routes under the root path. It is possible with solid-app-router but I can't see how to do it with file path routing.

Something like this example

<Route path='/' element={<div>Onion starts here <Outlet /></div>}>
  <Route path='layer1' element={<div>Another layer <Outlet /></div>}>
    <Route path='layer2' element={<div>Innermost layer</div>}></Route>
  </Route>
</Route>

HEAD: solid-start/routes.js: ReferenceError: exports is not defined

ReferenceError: exports is not defined
    at processRoute (file:///home/brian/work/portfoliome/censible-core/vendor/solid-start/packages/start/routes.js:65:44)
    at file:///home/brian/work/portfoliome/censible-core/vendor/solid-start/packages/start/routes.js:82:5
    at Array.reduce (<anonymous>)
    at getRoutes (file:///home/brian/work/portfoliome/censible-core/vendor/solid-start/packages/start/routes.js:80:29)
    at async Context.load (file:///home/brian/work/portfoliome/censible-core/vendor/solid-start/packages/start/plugin.js:24:26)
    at async Object.load (/home/brian/work/portfoliome/censible-core/node_modules/.pnpm/[email protected]/node_modules/vite/dist/node/chunks/dep-0351185a.js:36961:32)
    at async doTransform (/home/brian/work/portfoliome/censible-core/node_modules/.pnpm/[email protected]/node_modules/vite/dist/node/chunks/dep-0351185a.js:51996:24)

[Bug] Routes are not resolved correctly because of an incorrect regex

Some files in the pages directory are incorrectly resolved as routes.

For example:

src/pages/rockets.tsx --> /rock.tsx

This is because the periods (.) in the below regex are not escaped.

solid-start/packages/start/routes.js

Lines 22 to 24 in 596bc2e

 
 const regex = new RegExp(`(index)?(.(${pageExtensions.join("|")})|.data.js|.data.ts)`);

could not resolve entry module

I am just trying solid start to port my solid.js client side renderded app to solid start (although solid start is in active development) & It works really while dev build (solid-start dev). I tried it with graphql (urql), fetch to an api & its really cool!

but when i tried to run a production build (solid-start build) it fails saying can't find an entry module! why is this happening? I see that it needs unavailable files, how can i fix this?

Tests for solid-start

We need a good suite of:

unit tests for APIs
e2e tests for some of the examples that test our functionality

We should then run these as Github Actions.. we need confidence across the adapters

Possible to use both async and streaming SSR within the same page?

Is it possible to use both async and streaming SSR within the same page?

Consider the situation where:

3 requests to the backend API are required in order to fully populate a page;
we know that 2 of those requests will return within ~5ms because they are being returned directly from a cache; and
the remaining request takes > 500ms because it runs an uncached complex database query.

Ideally in this situation we could use async SSR for the first 2 requests (i.e. SolidJS should only start returning a response once those 2 backend requests have completed) and streaming SSR for the third, in order to avoid unnecessary page reflows and distracting visual flicker.

Is it possible to do this at present? As I understand it, Solid's SSR depends on Suspense boundaries to identify which content should be rendered asynchronously, so it presumably wouldn't currently be possible to distinguish between the two types of SSR (and therefore use them within the same page), but I would be very grateful for confirmation.

If not, is it something worth considering? This would also mean that users would not need to make a binary choice between async and streaming SSR.

An SSR example with fetching API

Hi, thanks for your great work, I love solid, I want to give it a try in my new project.

After npm init solid@next, it inited a simple template without feching any API, I can't find any documents about this, is there anything I missed?

[Umbrella] Starter Features

Given below are things I would expect from a solid starter

Modify root README code block language identifier from `json` to `jsonc`

Minor stuff, but currently the code block for "workspaces" option uses json for language identifier, which doesn't allow comments and leads to an eyesore (i.e. unintended text & background colors):

// in workspace root
{
  "workspaces": {
    "packages": [
      /* ... */
    ],
    "nohoist": ["**/solid-start"]
  }
}

// in project root of a workspace child
{
  "workspaces": {
    "nohoist": ["solid-start"]
  }
}

Simply changing the language identifier from json to jsonc makes that go away:

// in workspace root
{
  "workspaces": {
    "packages": [
      /* ... */
    ],
    "nohoist": ["**/solid-start"]
  }
}

// in project root of a workspace child
{
  "workspaces": {
    "nohoist": ["solid-start"]
  }
}

An Adapter for Fastly Compute@Edge

Could You Implement an Adapter for Fastly Compute@Edge?

They are Similar with Cloudflare Workers but they Compile your JS code to WASM to run it Faster at the Edge & Also they have Edge Dictionary which is Equivalent to Workers KV.

https://www.fastly.com/products/edge-compute/serverless

https://developer.fastly.com/learning/compute/javascript/

`npm run dev` is broken with [email protected] (Windows)

Describe the bug
I bootstrapped new project using solid-start but when trying to start it I get the error originating from solid-js/dist/server.cjs

To Reproduce
Provide a code snippet and steps to reproduce the behavior:

mkdir my-app
cd my-app
npm init solid@next
npm install
make sure that only version 1.2.6 of solid-js is intalled: npm ls solid-js
npm run dev -- --open

Expected behavior
No error, example app runs correctly.

Actual behavior

$ npm run dev -- --open

> dev
> solid-start dev "--open"

Pre-bundling dependencies:
  solid-js
  solid-js/web
  solid-js/store
  solid-js/html
  solid-js/h
(this will be run only when your dependencies or config have changed)
http://localhost:3000
TypeError: Cannot read properties of undefined (reading 'id')
    at wrap (C:\dev\my-app\node_modules\solid-js\dist\server.cjs:385:37)
    at Proxy.createComponent (C:\dev\my-app\node_modules\solid-js\dist\server.cjs:229:10)
    at Object.element.component.element.element [as outlet] (/node_modules/solid-app-router/dist/routing.js:59:35)
    at Object.get children [as children] (c:/dev/my-app/node_modules/solid-app-router/dist/components.jsx:56:57)
    at C:\dev\my-app\node_modules\solid-js\dist\server.cjs:138:35
    at C:\dev\my-app\node_modules\solid-js\dist\server.cjs:106:43
    at createMemo (C:\dev\my-app\node_modules\solid-js\dist\server.cjs:54:13)
    at children (C:\dev\my-app\node_modules\solid-js\dist\server.cjs:106:10)
    at C:\dev\my-app\node_modules\solid-js\dist\server.cjs:138:14
    at createMemo (C:\dev\my-app\node_modules\solid-js\dist\server.cjs:54:13)

Additional context
Downgrading solid-js to 1.2.5 fixes the issue:

Make sure you're using npm that supports overrides: npm i -g npm@^8.3.0

Apply this change:

diff --git a/package.json b/package.json
index b7bd862..21928be 100644
--- a/package.json
+++ b/package.json
@@ -8,7 +8,7 @@
   "type": "module",
   "devDependencies": {
     "solid-app-router": "^0.1.14",
-    "solid-js": "^1.2.6",
+    "solid-js": "1.2.5",
     "solid-meta": "^0.27.2",
     "solid-start": "next",
     "solid-start-node": "next",
@@ -16,5 +16,8 @@
   },
   "engines": {
     "node": ">=12"
+  },
+  "overrides": {
+    "solid-js": "1.2.5"
   }
 }

rm -rf package-lock.json node_modules
npm install
make sure that only version 1.2.5 of solid-js is intalled: npm ls solid-js
npm run dev -- --open

$ npm run dev -- --open

> dev
> solid-start dev "--open"

Pre-bundling dependencies:
  solid-js
  solid-js/web
  solid-js/store
  solid-js/html
  solid-js/h
(this will be run only when your dependencies or config have changed)
http://localhost:3000
You appear to have multiple instances of Solid. This can lead to unexpected behavior.
computations created outside a `createRoot` or `render` will never be disposed
computations created outside a `createRoot` or `render` will never be disposed
computations created outside a `createRoot` or `render` will never be disposed
computations created outside a `createRoot` or `render` will never be disposed
computations created outside a `createRoot` or `render` will never be disposed
computations created outside a `createRoot` or `render` will never be disposed
computations created outside a `createRoot` or `render` will never be disposed

Linking to pdf files inside `public` folder doesn't work on routing.

I have a repo that builds on top of solid-start here: https://github.com/nikitavoloboev/nikitavoloboev

I have a pdf file in public called cv.pdf: https://github.com/nikitavoloboev/nikitavoloboev/blob/main/public/cv.pdf

If I for example do this:

https://github.com/nikitavoloboev/nikitavoloboev/blob/a0ab2a594e77e0cbcc450de56099a15aa4691c06/src/components/Nav.tsx#L37

        <a class="nav-link" href="./cv.pdf">
          CV
        </a>

Inside the app if I go to this page, it will 404:

https://www.loom.com/share/900b34ae19904c59aed372d2a7457103

Not sure what I am doing wrong. I need to refresh the page for the PDF to actually show.

[alpha] Yarn - Incorrect Peer Dependency

Hello SolidJS,

I have a yarn error (warnings, but vercel builds failed) here, where I've been trying to resolve the incorrect peer dependency, for solid-start@next.

Also, here's my package.json file:

{
  "scripts": {
    ...
  },
  "type": "module",
  "private": true,
  "devDependencies": {
    "solid-app-router": "^0.3.2",
    "solid-js": "^1.3.15",
    "solid-meta": "^0.27.3",
    "solid-start": "next",
    "solid-start-vercel": "next",
    "vite": "^2.9.9"
  },
  "engines": {
    "node": "16.x"
  },
  "dependencies": {
    "axios": "^0.27.2",
    "tachyons": "4.12.0"
  }
}

Can you help? Thank you!

importing solid-styled-components triggers dev server error

Sorry if this is not the right place for this issue - I'm not sure if it belongs here or in solid-styled-components or in vite.

Repro

mkdir repro
cd repro
npm init solid@next - it doesn't matter if we go with TS or not
npm install
npm install solid-styled-components
echo 'import {} from "solid-styled-components"' >> src/root.jsx
npm run dev -- --open

$ npm run dev -- --open

> repro@ dev C:\dev\repro
> solid-start dev "--open"

http://localhost:3000
23:37:59 [vite] Error when evaluating SSR module /src/root.jsx:
Error [ERR_REQUIRE_ESM]: Must use import to load ES Module: C:\dev\repro\node_modules\solid-styled-components\src\index.js
require() of ES modules is not supported.
require() of C:\dev\repro\node_modules\solid-styled-components\src\index.js from C:\dev\repro\node_modules\vite\dist\node\chunks\dep-c1a9de64.js is an ES module file as it is a .js file whose nearest parent package.json contains "type": "module" which defines all .js files in that package scope as ES modules.
Instead rename index.js to end in .cjs, change the requiring code to use import(), or remove "type": "module" from C:\dev\repro\node_modules\solid-styled-components\package.json.

    at new NodeError (node:internal/errors:363:5)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1126:13)
    at Module.load (node:internal/modules/cjs/loader:989:32)
    at Function.Module._load (node:internal/modules/cjs/loader:829:14)
    at Module.require (node:internal/modules/cjs/loader:1013:19)
    at require (node:internal/modules/cjs/helpers:93:18)
    at nodeRequire (C:\dev\repro\node_modules\vite\dist\node\chunks\dep-c1a9de64.js:73479:17)
    at ssrImport (C:\dev\repro\node_modules\vite\dist\node\chunks\dep-c1a9de64.js:73431:20)
    at eval (/src/root.jsx:25:31)
    at instantiateModule (C:\dev\repro\node_modules\vite\dist\node\chunks\dep-c1a9de64.js:73464:166)
Error [ERR_REQUIRE_ESM]: Must use import to load ES Module: C:\dev\repro\node_modules\solid-styled-components\src\index.js
require() of ES modules is not supported.
require() of C:\dev\repro\node_modules\solid-styled-components\src\index.js from C:\dev\repro\node_modules\vite\dist\node\chunks\dep-c1a9de64.js is an ES module file as it is a .js file whose nearest parent package.json contains "type": "module" which defines all .js files in that package scope as ES modules.
Instead rename index.js to end in .cjs, change the requiring code to use import(), or remove "type": "module" from C:\dev\repro\node_modules\solid-styled-components\package.json.

    at new NodeError (node:internal/errors:363:5)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1126:13)
    at Module.load (node:internal/modules/cjs/loader:989:32)
    at Function.Module._load (node:internal/modules/cjs/loader:829:14)
    at Module.require (node:internal/modules/cjs/loader:1013:19)
    at require (node:internal/modules/cjs/helpers:93:18)
    at nodeRequire (C:\dev\repro\node_modules\vite\dist\node\chunks\dep-c1a9de64.js:73479:17)
    at ssrImport (C:\dev\repro\node_modules\vite\dist\node\chunks\dep-c1a9de64.js:73431:20)
    at eval (/src/root.jsx:25:31)
    at instantiateModule (C:\dev\repro\node_modules\vite\dist\node\chunks\dep-c1a9de64.js:73464:166)

Environment

$ npx envinfo --system --npmPackages --binaries
npx: installed 1 in 1.411s

  System:
    OS: Windows 10 10.0.19043
    CPU: (8) x64 Intel(R) Core(TM) i5-9300H CPU @ 2.40GHz
    Memory: 7.97 GB / 15.86 GB
  Binaries:
    Node: 16.2.0 - C:\.tools\nodejs\node.EXE
    Yarn: 1.22.10 - ~\AppData\Roaming\npm\yarn.CMD
    npm: 6.14.13 - C:\.tools\nodejs\npm.CMD
  npmPackages:
    solid-app-router: ^0.1.3 => 0.1.3
    solid-js: ^1.0.5 => 1.0.6
    solid-meta: ^0.27.0 => 0.27.1
    solid-start: next => 0.1.0-alpha.28
    solid-start-node: next => 0.1.0-alpha.28
    solid-styled-components: ^0.27.1 => 0.27.1
    vite: ^2.4.3 => 2.4.4

Support Nested Routing and Manifests

Solid App Router supports nested routing. They do so by naming a file the same name as the folder. In so it acts as the parent. I haven't added that yet.

In addition we need to make sure that manifest lookup for preload works as well.


	const regex = new RegExp(`(index)?(.(${pageExtensions.join("\|")})\|.data.js\|.data.ts)`);