skeletonlabs / skeleton

A complete design system and component solution, built on Tailwind.
https://skeleton.dev
MIT License
4.89k stars 305 forks source link

CompileError: 'files' is not a valid binding. with Svelte5 #2238

Closed xmlking closed 10 months ago

xmlking commented 10 months ago

Current Behavior

when created new project with pnpm create skeleton-app@latest my-skeleton-app and upgraded svelte to "svelte": "next" I am getting this error when I access page

image
[plugin:vite-plugin-svelte] /Users/schintha/Developer/Work/SPA/temp/my-skeleton-app/node_modules/.pnpm/@skeletonlabs+skeleton@2.5.0_svelte@5.0.0-next.2/node_modules/@skeletonlabs/skeleton/dist/components/FileButton/FileButton.svelte:23:43 'files' is not a valid binding
/Users/schintha/Developer/Work/SPA/temp/my-skeleton-app/node_modules/.pnpm/@skeletonlabs+skeleton@2.5.0_svelte@5.0.0-next.2/node_modules/@skeletonlabs/skeleton/dist/components/FileButton/FileButton.svelte:23:43
21 |    <!-- NOTE: Don't use `hidden` as it prevents `required` from operating -->
22 |    <div class="w-0 h-0 overflow-hidden">
23 |        <input type="file" bind:this={fileInput} bind:files {name} {...prunedRestProps()} on:change />
   |                                             ^
24 |    </div>
25 |    <!-- Button -->
CompileError: 'files' is not a valid binding
    at error (file:///Users/schintha/Developer/Work/SPA/temp/my-skeleton-app/node_modules/.pnpm/svelte@5.0.0-next.2/node_modules/svelte/src/compiler/errors.js:568:8)
    at BindDirective (file:///Users/schintha/Developer/Work/SPA/temp/my-skeleton-app/node_modules/.pnpm/svelte@5.0.0-next.2/node_modules/svelte/src/compiler/phases/2-analyze/validation.js:359:5)
    at go (file:///Users/schintha/Developer/Work/SPA/temp/my-skeleton-app/node_modules/.pnpm/svelte@5.0.0-next.2/node_modules/svelte/src/compiler/phases/visitors.js:49:5)
    at visitor (file:///Users/schintha/Developer/Work/SPA/temp/my-skeleton-app/node_modules/.pnpm/svelte@5.0.0-next.2/node_modules/svelte/src/compiler/phases/visitors.js:64:4)
    at go (file:///Users/schintha/Developer/Work/SPA/temp/my-skeleton-app/node_modules/.pnpm/svelte@5.0.0-next.2/node_modules/svelte/src/compiler/phases/visitors.js:49:5)
    at visitor (file:///Users/schintha/Developer/Work/SPA/temp/my-skeleton-app/node_modules/.pnpm/svelte@5.0.0-next.2/node_modules/svelte/src/compiler/phases/visitors.js:64:4)
    at Object.next (file:///Users/schintha/Developer/Work/SPA/temp/my-skeleton-app/node_modules/.pnpm/zimmerframe@1.1.0/node_modules/zimmerframe/src/walk.js:106:21)
    at go (file:///Users/schintha/Developer/Work/SPA/temp/my-skeleton-app/node_modules/.pnpm/svelte@5.0.0-next.2/node_modules/svelte/src/compiler/phases/visitors.js:45:29)
    at next (file:///Users/schintha/Developer/Work/SPA/temp/my-skeleton-app/node_modules/.pnpm/svelte@5.0.0-next.2/node_modules/svelte/src/compiler/phases/visitors.js:55:7)
    at _ (file:///Users/schintha/Developer/Work/SPA/temp/my-skeleton-app/node_modules/.pnpm/svelte@5.0.0

Expected Behavior

page should display welcome screen

Steps To Reproduce

  1. create new project with pnpm create skeleton-app@latest my-skeleton-app
  2. upgrade "svelte": "next" in package.json
  3. pnpm install
  4. pnpm dev

Link to Reproduction / Stackblitz

No response

More Information

No response

Sarenor commented 10 months ago

Svelte 5 went into prerelease 5 days ago. Skeleton simply didn't have time to even start working on compatibility yet. Once there's release candidates and the Svelte Core team have deemed Svelte 5 reasonably stable, compatibility with Svelte 5 will be a high priority. Until then, I would suggest using Svelte 4 for your Skeleton projects.