[Bug?]: SolidStart fails to start with Daisyui and tailwindcss #1503

lmtr0 · 2024-05-24T13:00:51Z

Duplicates

I have searched the existing issues

Latest version

I have tested the latest version

Current behavior 😯

After installing daisyui following their documentation and adding it to tailwindcss, the server fails to build the client and I can't start the dev server.

here is the output

> bun dev
$ vinxi dev
vinxi v0.3.11
vinxi starting dev server

  ➜ Local:    http://localhost:3000/
  ➜ Network:  use --host to expose


🌼   daisyUI 4.11.1
├─ ✔︎ 2 themes added            https://daisyui.com/docs/themes
╰─ ★ Star daisyUI on GitHub     https://github.com/saadeghi/daisyui

/home/me/repo/warpfactor/autodialer/client/node_modules/.pnpm/@[email protected][email protected][email protected][email protected]_@[email protected]_@typ_cofjxkxhwsoh6svfiqk3i4goem/node_modules/@solidjs/start/dist/server/StartServer.jsx:65
  __vite_ssr_import_6__.useAssets(() => assets.length ? assets.map((m) => __vite_ssr_import_8__.renderAsset(m)) : void 0);
                                               ^

TypeError: Cannot read properties of undefined (reading 'length')
    at eval (/home/me/repo/warpfactor/autodialer/client/node_modules/.pnpm/@[email protected][email protected][email protected][email protected]_@[email protected]_@typ_cofjxkxhwsoh6svfiqk3i4goem/node_modules/@solidjs/start/dist/server/StartServer.jsx:65:48)
    at Array.<anonymous> (file:///home/me/repo/warpfactor/autodialer/client/node_modules/.pnpm/[email protected]/node_modules/solid-js/web/dist/server.js:539:57)
    at injectAssets (file:///home/me/repo/warpfactor/autodialer/client/node_modules/.pnpm/[email protected]/node_modules/solid-js/web/dist/server.js:584:70)
    at doShell (file:///home/me/repo/warpfactor/autodialer/client/node_modules/.pnpm/[email protected]/node_modules/solid-js/web/dist/server.js:295:12)
    at Object.onDone (file:///home/me/repo/warpfactor/autodialer/client/node_modules/.pnpm/[email protected]/node_modules/solid-js/web/dist/server.js:163:5)
    at Te.flush (file:///home/me/repo/warpfactor/autodialer/client/node_modules/.pnpm/[email protected]/node_modules/seroval/dist/esm/production/index.mjs:17:38999)
    at file:///home/me/repo/warpfactor/autodialer/client/node_modules/.pnpm/[email protected]/node_modules/solid-js/web/dist/server.js:182:42

Node.js v20.11.1
error: script "dev" exited with code 1

However the build process works and the nitro server doesn't fail

Expected behavior 🤔

Start the dev server without errors

Steps to reproduce 🕹

Steps:

when a command is [cmd1|cmd2] means I rand both of then to test.

run [pnpm|npm] create solid and check the tailwindcss option
run [bun|pnpm|yarn] install daisyui@latest
then alter the tailwindcss file:

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: ["./src/**/*.{html,js,jsx,ts,tsx}"],
  theme: {
    extend: {}
  },
  plugins: [
    require('daisyui'),
  ]
};

run [bun|pnpm] dev, then, open the browser, the output in the terminal should be:

> bun dev
$ vinxi dev
vinxi v0.3.11
vinxi starting dev server

  ➜ Local:    http://localhost:3000/
  ➜ Network:  use --host to expose


🌼   daisyUI 4.11.1
├─ ✔︎ 2 themes added            https://daisyui.com/docs/themes
╰─ ★ Star daisyUI on GitHub     https://github.com/saadeghi/daisyui

/home/me/repo/warpfactor/autodialer/client/node_modules/.pnpm/@[email protected][email protected][email protected][email protected]_@[email protected]_@typ_cofjxkxhwsoh6svfiqk3i4goem/node_modules/@solidjs/start/dist/server/StartServer.jsx:65
  __vite_ssr_import_6__.useAssets(() => assets.length ? assets.map((m) => __vite_ssr_import_8__.renderAsset(m)) : void 0);
                                               ^

TypeError: Cannot read properties of undefined (reading 'length')
    at eval (/home/me/repo/warpfactor/autodialer/client/node_modules/.pnpm/@[email protected][email protected][email protected][email protected]_@[email protected]_@typ_cofjxkxhwsoh6svfiqk3i4goem/node_modules/@solidjs/start/dist/server/StartServer.jsx:65:48)
    at Array.<anonymous> (file:///home/me/repo/warpfactor/autodialer/client/node_modules/.pnpm/[email protected]/node_modules/solid-js/web/dist/server.js:539:57)
    at injectAssets (file:///home/me/repo/warpfactor/autodialer/client/node_modules/.pnpm/[email protected]/node_modules/solid-js/web/dist/server.js:584:70)
    at doShell (file:///home/me/repo/warpfactor/autodialer/client/node_modules/.pnpm/[email protected]/node_modules/solid-js/web/dist/server.js:295:12)
    at Object.onDone (file:///home/me/repo/warpfactor/autodialer/client/node_modules/.pnpm/[email protected]/node_modules/solid-js/web/dist/server.js:163:5)
    at Te.flush (file:///home/me/repo/warpfactor/autodialer/client/node_modules/.pnpm/[email protected]/node_modules/seroval/dist/esm/production/index.mjs:17:38999)
    at file:///home/me/repo/warpfactor/autodialer/client/node_modules/.pnpm/[email protected]/node_modules/solid-js/web/dist/server.js:182:42

Node.js v20.11.1
error: script "dev" exited with code 1

Context 🔦

I'm trying to make a website with tailwindcss, daisyui to be deployed to cloudflare workers

Your environment 🌎

System:
   os: Linux fedora 6.8.9-300.fc40.x86_64 
   cpu: amd64
Binaries:
   node: v20.11.1
   pnpm: 9.1.2
   bun: 1.1.4
Packages:
    "@solidjs/router": "^0.13.3",
    "@solidjs/start": "^1.0.0",
    "autoprefixer": "^10.4.19",
    "postcss": "^8.4.38",
    "solid-js": "^1.8.17",
    "tailwindcss": "^3.4.3",
    "vinxi": "^0.3.11"

The text was updated successfully, but these errors were encountered:

lmtr0 · 2024-05-24T13:03:59Z

Problem looks to be originating from useAssets(() => (assets.length ? assets.map(m => renderAsset(m)) : undefined));

lmtr0 · 2024-05-24T13:16:02Z

Lol, I think there is a problem with the template, I just went through the manual process of adding tailwind in the basic template and It worked.

harveylii · 2024-05-25T12:37:47Z

I‘m alos having this issue, but I did not use any ui framework...

lmtr0 · 2024-05-25T13:39:50Z

I‘m alos having this issue, but I did not use any ui framework...

did your issue also solve itself once you did the manual setup?

harveylii · 2024-05-25T15:28:12Z

I‘m alos having this issue, but I did not use any ui framework...

did your issue also solve itself once you did the manual setup?

nope, it's still here

lmtr0 · 2024-05-25T15:48:02Z

can you share how you did the setup?

CripyIce · 2024-05-26T10:53:44Z

Same here, but without even adding DaisyUI.
Just tried today creating a new SolidStart project with tailwind template as the CLI offered me, and got the same error.

/Users/eitanaflalo/Documents/solid-project/node_modules/@solidjs/start/dist/server/StartServer.jsx:65
  __vite_ssr_import_6__.useAssets(() => assets.length ? assets.map((m) => __vite_ssr_import_8__.renderAsset(m)) : void 0);
                                               ^

TypeError: Cannot read properties of undefined (reading 'length')
    at eval (/Users/eitanaflalo/Documents/solid-project/node_modules/@solidjs/start/dist/server/StartServer.jsx:65:48)
    at Array.<anonymous> (file:///Users/eitanaflalo/Documents/solid-project/node_modules/solid-js/web/dist/server.js:539:57)
    at injectAssets (file:///Users/eitanaflalo/Documents/solid-project/node_modules/solid-js/web/dist/server.js:584:70)
    at doShell (file:///Users/eitanaflalo/Documents/solid-project/node_modules/solid-js/web/dist/server.js:295:12)
    at Object.onDone (file:///Users/eitanaflalo/Documents/solid-project/node_modules/solid-js/web/dist/server.js:163:5)
    at Te.flush (file:///Users/eitanaflalo/Documents/solid-project/node_modules/seroval/dist/esm/production/index.mjs:17:38999)
    at file:///Users/eitanaflalo/Documents/solid-project/node_modules/solid-js/web/dist/server.js:182:42

Node.js v18.18.0
error: script "dev" exited with code 1

thinke5 · 2024-05-27T06:21:50Z

I think it's because of this

https://github.com/ryansolid/dom-expressions/blob/38ad815b0c610b936ad140ed5c230afe4419d3b7/packages/dom-expressions/src/client.js#L40

eduludi · 2024-05-27T08:13:01Z

Same error here, except I'm not using DaisyUI. Just started a new solid-start project with tailwindcss (using javascript).

I added a ?operator after assets in node_modules/@solidjs/start/dist/server/StartServer.jsx, line 57:

useAssets(() => (assets?.length ? assets.map(m => renderAsset(m)) : undefined));

That fixed the issue, but not sure of the implications of that.

kms0219kms · 2024-05-27T14:54:09Z

Same here. I didn't used tailwindcss and I used solid-styled-components.

node_modules/.pnpm/@[email protected][email protected][email protected][email protected]_@[email protected]_@typ_cofjxkxhwsoh6svfiqk3i4goem/node_modules/@solidjs/start/dist/server/StartServer.jsx:65
  __vite_ssr_import_6__.useAssets(() => assets.length ? assets.map((m) => __vite_ssr_import_8__.renderAsset(m)) : void 0);
                                               ^

TypeError: Cannot read properties of undefined (reading 'length')
    at eval (/workspaces/wakulator/node_modules/.pnpm/@[email protected][email protected][email protected][email protected]_@[email protected]_@typ_cofjxkxhwsoh6svfiqk3i4goem/node_modules/@solidjs/start/dist/server/StartServer.jsx:65:48)
    at Array.<anonymous> (file:///workspaces/wakulator/node_modules/.pnpm/[email protected]/node_modules/solid-js/web/dist/server.js:539:57)
    at injectAssets (file:///workspaces/wakulator/node_modules/.pnpm/[email protected]/node_modules/solid-js/web/dist/server.js:584:70)
    at doShell (file:///workspaces/wakulator/node_modules/.pnpm/[email protected]/node_modules/solid-js/web/dist/server.js:295:12)
    at Object.onDone (file:///workspaces/wakulator/node_modules/.pnpm/[email protected]/node_modules/solid-js/web/dist/server.js:163:5)
    at Te.flush (file:///workspaces/wakulator/node_modules/.pnpm/[email protected]/node_modules/seroval/dist/esm/production/index.mjs:17:38999)
    at file:///workspaces/wakulator/node_modules/.pnpm/[email protected]/node_modules/solid-js/web/dist/server.js:182:42

Node.js v20.13.1

And, @eduludi 's fix is worked well. However, this is just temporary fix.
I need a permanent fix as I am using CI for production deployment.

harveylii · 2024-05-27T15:27:13Z

I've fixed this issue through a very strange way. I add ? after assets in node_modules/@solidjs/start/dist/server/StartServer.jsx line 57:

useAssets(() => (assets?.length ? assets.map(m => renderAsset(m)) : undefined));

That fixed this issue temporarily, but there is a Hydration Mismatch error shows up after the app started. I checked the entire project and found out nothing unnormal, so I tried adding a Suspense component at the topest of my app, then everything runs fine.

After this I delete the ? I add before, the app is still running properly.
Can not figure out why...

lmtr0 · 2024-05-28T23:39:29Z

@harveylii Is it to any good for you to make a pr, I fixed by doing the work of setting up tailwindcss with daisyui manually in the basic template. So It makes me think that there is a problem with the template itself, and not with the framework. But probably I'm wrong as I'm not very familiar with the internal workings of solid start

Brendonovich · 2024-05-29T02:04:00Z

I think my last PR already implemented the equivalent of that fix, since I just gave assets a default value.

lmtr0 · 2024-05-29T12:46:23Z

@Brendonovich so, it's just a matter of updating the templates and the dependencies?

Brendonovich · 2024-05-29T12:55:34Z

Once the change is released yeah

lmtr0 · 2024-05-29T12:56:35Z

sounds good

harrybawsac · 2024-05-29T20:21:07Z

I got the same problem here. I just started a new solid start project with tailwind CSS (the starter). It presented the error on the first yarn dev run.

Building it and then running with yarn start, works perfectly.

han-tyumi · 2024-05-30T03:38:52Z

v1.0.1 seems to fix the issue for me. 🎉

harrybawsac · 2024-05-30T07:51:23Z

Yes! Can confirm it's been fixed.

lmtr0 · 2024-05-30T15:05:53Z

Can confirm, v1.0.1 fixed the issue

lmtr0 added the bug Something isn't working label May 24, 2024

lmtr0 closed this as completed May 30, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[Bug?]: SolidStart fails to start with Daisyui and tailwindcss #1503

[Bug?]: SolidStart fails to start with Daisyui and tailwindcss #1503

lmtr0 commented May 24, 2024

lmtr0 commented May 24, 2024

lmtr0 commented May 24, 2024

harveylii commented May 25, 2024

lmtr0 commented May 25, 2024

harveylii commented May 25, 2024

lmtr0 commented May 25, 2024

CripyIce commented May 26, 2024

thinke5 commented May 27, 2024 •

edited

Loading

eduludi commented May 27, 2024

kms0219kms commented May 27, 2024 •

edited

Loading

harveylii commented May 27, 2024 •

edited

Loading

lmtr0 commented May 28, 2024

Brendonovich commented May 29, 2024

lmtr0 commented May 29, 2024 •

edited

Loading

Brendonovich commented May 29, 2024

lmtr0 commented May 29, 2024

harrybawsac commented May 29, 2024 •

edited

Loading

han-tyumi commented May 30, 2024

harrybawsac commented May 30, 2024

lmtr0 commented May 30, 2024

[Bug?]: SolidStart fails to start with Daisyui and tailwindcss #1503

[Bug?]: SolidStart fails to start with Daisyui and tailwindcss #1503

Comments

lmtr0 commented May 24, 2024

Duplicates

Latest version

Current behavior 😯

Expected behavior 🤔

Steps to reproduce 🕹

Context 🔦

Your environment 🌎

lmtr0 commented May 24, 2024

lmtr0 commented May 24, 2024

harveylii commented May 25, 2024

lmtr0 commented May 25, 2024

harveylii commented May 25, 2024

lmtr0 commented May 25, 2024

CripyIce commented May 26, 2024

thinke5 commented May 27, 2024 • edited Loading

eduludi commented May 27, 2024

kms0219kms commented May 27, 2024 • edited Loading

harveylii commented May 27, 2024 • edited Loading

lmtr0 commented May 28, 2024

Brendonovich commented May 29, 2024

lmtr0 commented May 29, 2024 • edited Loading

Brendonovich commented May 29, 2024

lmtr0 commented May 29, 2024

harrybawsac commented May 29, 2024 • edited Loading

han-tyumi commented May 30, 2024

harrybawsac commented May 30, 2024

lmtr0 commented May 30, 2024

thinke5 commented May 27, 2024 •

edited

Loading

kms0219kms commented May 27, 2024 •

edited

Loading

harveylii commented May 27, 2024 •

edited

Loading

lmtr0 commented May 29, 2024 •

edited

Loading

harrybawsac commented May 29, 2024 •

edited

Loading