Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Demo app cannot be built with the static adapter since the introduction of shadow endpoints (error 500 /todos) #3833

Closed
deshartman opened this issue Feb 11, 2022 · 13 comments
Closed

Demo app cannot be built with the static adapter since the introduction of shadow endpoints (error 500 /todos) #3833

deshartman opened this issue Feb 11, 2022 · 13 comments

Comments

@deshartman
Copy link

Describe the bug

PR3679 has broken the demo application build process for static adapter. It now shows a 500 error when doing build.

Reproduction

Steps to reproduce:
npm init svelte@next functions

Use TypeScript? … Yes
Add ESLint for code linting? … Yes
Add Prettier for code formatting? … Yes

cd functions
npm install

Change adaptor to static in svelte.config.js
import adapter from '@sveltejs/adapter-static';

Install the static adapter:
npm install @sveltejs/adapter-static@next

Build project
npm run build

npm run build

functions@0.0.1 build
svelte-kit build

vite v2.8.0 building for production...
✓ 34 modules transformed.
.svelte-kit/output/client/_app/assets/svelte-logo-87df40b8.svg 1.85 KiB
.svelte-kit/output/client/_app/assets/fira-mono-greek-ext-400-normal-9e2fe623.woff2 7.33 KiB
.svelte-kit/output/client/_app/assets/fira-mono-cyrillic-ext-400-normal-3df7909e.woff2 15.40 KiB
.svelte-kit/output/client/_app/assets/fira-mono-latin-ext-400-normal-6bfabd30.woff2 11.10 KiB
.svelte-kit/output/client/_app/assets/fira-mono-cyrillic-400-normal-c7d433fd.woff2 8.89 KiB
.svelte-kit/output/client/_app/assets/fira-mono-greek-400-normal-a8be01ce.woff2 10.27 KiB
.svelte-kit/output/client/_app/assets/fira-mono-latin-400-normal-e43b3538.woff2 15.90 KiB
.svelte-kit/output/client/_app/assets/fira-mono-all-400-normal-1e3b098c.woff 75.55 KiB
.svelte-kit/output/client/_app/manifest.json 2.51 KiB
.svelte-kit/output/client/_app/pages/__layout.svelte-1fdcf5b9.js 4.76 KiB / gzip: 1.86 KiB
.svelte-kit/output/client/_app/error.svelte-6f6d00da.js 1.56 KiB / gzip: 0.75 KiB
.svelte-kit/output/client/_app/pages/index.svelte-92dd2217.js 4.08 KiB / gzip: 1.69 KiB
.svelte-kit/output/client/_app/pages/about.svelte-64b29582.js 2.38 KiB / gzip: 1.09 KiB
.svelte-kit/output/client/_app/pages/todos/index.svelte-0cc5f931.js 5.91 KiB / gzip: 2.40 KiB
.svelte-kit/output/client/_app/chunks/singletons-a6a7384f.js 0.05 KiB / gzip: 0.07 KiB
.svelte-kit/output/client/_app/start-f44d78f5.js 23.36 KiB / gzip: 7.95 KiB
.svelte-kit/output/client/_app/assets/pages/todos/index.svelte-784042c1.css 3.70 KiB / gzip: 1.04 KiB
.svelte-kit/output/client/_app/assets/pages/index.svelte-1d45bd0c.css 1.40 KiB / gzip: 0.50 KiB
.svelte-kit/output/client/_app/assets/pages/about.svelte-bf4528fa.css 0.11 KiB / gzip: 0.10 KiB
.svelte-kit/output/client/_app/chunks/vendor-ee294e9e.js 14.16 KiB / gzip: 6.04 KiB
.svelte-kit/output/client/_app/assets/pages/__layout.svelte-15681802.css 4.96 KiB / gzip: 1.55 KiB
vite v2.8.0 building SSR bundle for production...
✓ 36 modules transformed.
.svelte-kit/output/server/manifest.json 2.15 KiB
.svelte-kit/output/server/app.js 63.28 KiB
.svelte-kit/output/server/entries/endpoints/todos/index.ts.js 1.23 KiB
.svelte-kit/output/server/entries/pages/__layout.svelte.js 4.60 KiB
.svelte-kit/output/server/entries/pages/error.svelte.js 0.72 KiB
.svelte-kit/output/server/entries/pages/index.svelte.js 8.07 KiB
.svelte-kit/output/server/entries/pages/about.svelte.js 1.30 KiB
.svelte-kit/output/server/entries/pages/todos/index.svelte.js 5.84 KiB
.svelte-kit/output/server/chunks/index-ee9fdf1a.js 4.24 KiB

Run npm run preview to preview your production build locally.

Using @sveltejs/adapter-static
500 /todos
at file:///functions/node_modules/@sveltejs/kit/dist/chunks/index5.js:408:11
at visit (file:///functions/node_modules/@sveltejs/kit/dist/chunks/index5.js:585:4)
at processTicksAndRejections (internal/process/task_queues.js:95:5)

What has changed:

  • Missing [uid].json.ts
  • Missing index.json.ts
  • New file index.ts

Logs

No response

System Info

System:
    OS: macOS 12.2
    CPU: (12) x64 Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz
    Memory: 252.46 MB / 16.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 14.18.1 - /usr/local/bin/node
    Yarn: 1.22.14 - /usr/local/bin/yarn
    npm: 8.1.1 - /usr/local/bin/npm
  Browsers:
    Brave Browser: 91.1.26.67
    Chrome: 98.0.4758.80
    Safari: 15.3
  npmPackages:
    @sveltejs/adapter-auto: next => 1.0.0-next.17 
    @sveltejs/adapter-static: ^1.0.0-next.26 => 1.0.0-next.26 
    @sveltejs/kit: next => 1.0.0-next.265 
    svelte: ^3.46.0 => 3.46.4

Severity

blocking all usage of SvelteKit

Additional Information

No response
@deshartman deshartman mentioned this issue Feb 11, 2022
Closed
@robots4life
Copy link

robots4life commented Feb 11, 2022 •
edited
Loading

I get different errors when following the steps to reproduce.

npm run build

> functions@0.0.1 build
> svelte-kit build

vite v2.8.0 building for production...
✓ 5 modules transformed.
[vite-plugin-svelte] /shared/httpd/functions/src/routes/todos/index.svelte:6:6 Unexpected token
file: /shared/httpd/functions/src/routes/todos/index.svelte:6:6
 4 |    import { flip } from 'svelte/animate';
 5 |  
 6 |    type Todo = {
             ^
 7 |      uid: string;
 8 |      created_at: Date;
> /shared/httpd/functions/src/routes/todos/index.svelte:6:6 Unexpected token
    at error (file:///shared/httpd/functions/node_modules/svelte/compiler.mjs:17691:19)
    at Parser$1.error (file:///shared/httpd/functions/node_modules/svelte/compiler.mjs:17767:9)
    at Parser$1.acorn_error (file:///shared/httpd/functions/node_modules/svelte/compiler.mjs:17761:14)
    at Object.read_script [as read] (file:///shared/httpd/functions/node_modules/svelte/compiler.mjs:8813:16)
    at tag (file:///shared/httpd/functions/node_modules/svelte/compiler.mjs:16817:33)
    at new Parser$1 (file:///shared/httpd/functions/node_modules/svelte/compiler.mjs:17726:21)
    at parse$3 (file:///shared/httpd/functions/node_modules/svelte/compiler.mjs:17858:20)
    at compile (file:///shared/httpd/functions/node_modules/svelte/compiler.mjs:31871:17)
    at compileSvelte2 (file:///shared/httpd/functions/node_modules/@sveltejs/vite-plugin-svelte/dist/index.js:319:20)
    at async Object.transform (file:///shared/httpd/functions/node_modules/@sveltejs/vite-plugin-svelte/dist/index.js:1602:23)
[!] Error: unfinished hook action(s) on exit:
(vite:css) transform "/shared/httpd/functions/src/routes/__layout.svelte?svelte&type=style&lang.css"
(vite:load-fallback) load "/shared/httpd/functions/node_modules/svelte/internal/index.mjs"
(vite:load-fallback) load "/shared/httpd/functions/src/app.css"
(vite:load-fallback) load "/shared/httpd/functions/src/lib/header/Header.svelte"
(vite:load-fallback) load "/shared/httpd/functions/node_modules/svelte/index.mjs"
(vite:load-fallback) load "/shared/httpd/functions/.svelte-kit/runtime/chunks/utils.js"
(vite:load-fallback) load "/shared/httpd/functions/node_modules/svelte/store/index.mjs"
(vite:load-fallback) load "/shared/httpd/functions/.svelte-kit/runtime/paths.js"
(vite:load-fallback) load "/shared/httpd/functions/.svelte-kit/runtime/client/singletons.js"
(vite:load-fallback) load "/shared/httpd/functions/.svelte-kit/generated/root.svelte"
(vite:load-fallback) load "/shared/httpd/functions/.svelte-kit/generated/manifest.js"
(vite:css) transform "/shared/httpd/functions/src/routes/about.svelte?svelte&type=style&lang.css"
(vite:load-fallback) load "/shared/httpd/functions/.svelte-kit/runtime/app/env.js"
(vite:css) transform "/shared/httpd/functions/src/routes/index.svelte?svelte&type=style&lang.css"
(vite:load-fallback) load "/shared/httpd/functions/src/lib/Counter.svelte"

npm run preview

> functions@0.0.1 preview
> svelte-kit preview

> Cannot find module '/shared/httpd/functions/.svelte-kit/output/server/app.js' imported from /shared/httpd/functions/node_modules/@sveltejs/kit/dist/chunks/index6.js
    at new NodeError (node:internal/errors:371:5)
    at finalizeResolution (node:internal/modules/esm/resolve:394:11)
    at moduleResolve (node:internal/modules/esm/resolve:944:10)
    at defaultResolve (node:internal/modules/esm/resolve:1041:11)
    at ESMLoader.resolve (node:internal/modules/esm/loader:530:30)
    at ESMLoader.getModuleJob (node:internal/modules/esm/loader:251:18)
    at ESMLoader.import (node:internal/modules/esm/loader:332:22)
    at importModuleDynamically (node:internal/modules/esm/translators:106:35)
    at importModuleDynamicallyCallback (node:internal/process/esm_loader:35:14)
    at preview (file:///shared/httpd/functions/node_modules/@sveltejs/kit/dist/chunks/index6.js:52:64)

@robots4life
Copy link

For the demo app without TS I get the following errors.

npm run build

> demo@0.0.1 build
> svelte-kit build

vite v2.8.0 building for production...
✓ 34 modules transformed.
.svelte-kit/output/client/_app/assets/svelte-logo-87df40b8.svg                           1.85 KiB
.svelte-kit/output/client/_app/assets/fira-mono-cyrillic-ext-400-normal-3df7909e.woff2   15.40 KiB
.svelte-kit/output/client/_app/assets/fira-mono-cyrillic-400-normal-c7d433fd.woff2       8.89 KiB
.svelte-kit/output/client/_app/assets/fira-mono-latin-ext-400-normal-6bfabd30.woff2      11.10 KiB
.svelte-kit/output/client/_app/assets/fira-mono-greek-ext-400-normal-9e2fe623.woff2      7.33 KiB
.svelte-kit/output/client/_app/assets/fira-mono-greek-400-normal-a8be01ce.woff2          10.27 KiB
.svelte-kit/output/client/_app/assets/fira-mono-latin-400-normal-e43b3538.woff2          15.90 KiB
.svelte-kit/output/client/_app/assets/fira-mono-all-400-normal-1e3b098c.woff             75.55 KiB
.svelte-kit/output/client/_app/manifest.json                                             2.51 KiB
.svelte-kit/output/client/_app/pages/__layout.svelte-1fdcf5b9.js                         4.76 KiB / gzip: 1.86 KiB
.svelte-kit/output/client/_app/error.svelte-6f6d00da.js                                  1.56 KiB / gzip: 0.75 KiB
.svelte-kit/output/client/_app/pages/about.svelte-64b29582.js                            2.38 KiB / gzip: 1.09 KiB
.svelte-kit/output/client/_app/pages/index.svelte-92dd2217.js                            4.08 KiB / gzip: 1.69 KiB
.svelte-kit/output/client/_app/start-fb1fe160.js                                         23.36 KiB / gzip: 7.95 KiB
.svelte-kit/output/client/_app/pages/todos/index.svelte-9111d728.js                      5.91 KiB / gzip: 2.40 KiB
.svelte-kit/output/client/_app/chunks/singletons-a6a7384f.js                             0.05 KiB / gzip: 0.07 KiB
.svelte-kit/output/client/_app/assets/pages/todos/index.svelte-784042c1.css              3.70 KiB / gzip: 1.04 KiB
.svelte-kit/output/client/_app/chunks/vendor-ee294e9e.js                                 14.16 KiB / gzip: 6.04 KiB
.svelte-kit/output/client/_app/assets/pages/about.svelte-bf4528fa.css                    0.11 KiB / gzip: 0.10 KiB
.svelte-kit/output/client/_app/assets/pages/index.svelte-1d45bd0c.css                    1.40 KiB / gzip: 0.50 KiB
.svelte-kit/output/client/_app/assets/pages/__layout.svelte-15681802.css                 4.96 KiB / gzip: 1.55 KiB
vite v2.8.0 building SSR bundle for production...
✓ 36 modules transformed.
.svelte-kit/output/server/manifest.json                         2.15 KiB
.svelte-kit/output/server/app.js                                63.26 KiB
.svelte-kit/output/server/entries/endpoints/todos/index.js      1.23 KiB
.svelte-kit/output/server/entries/pages/__layout.svelte.js      4.60 KiB
.svelte-kit/output/server/entries/pages/error.svelte.js         0.72 KiB
.svelte-kit/output/server/entries/pages/index.svelte.js         8.07 KiB
.svelte-kit/output/server/entries/pages/about.svelte.js         1.30 KiB
.svelte-kit/output/server/entries/pages/todos/index.svelte.js   5.84 KiB
.svelte-kit/output/server/chunks/index-ee9fdf1a.js              4.24 KiB

Run npm run preview to preview your production build locally.

> Using @sveltejs/adapter-static
> 500 /todos
    at file:///shared/httpd/demo/node_modules/@sveltejs/kit/dist/chunks/index5.js:408:11
    at visit (file:///shared/httpd/demo/node_modules/@sveltejs/kit/dist/chunks/index5.js:585:4)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)

@babichjacob babichjacob mentioned this issue Feb 13, 2022
Closed
@babichjacob babichjacob changed the title Shadow endpoints #3679 - breaks static build Demo app cannot be built with the static adapter since the introduction of shadow endpoints (error 500 /todos) Feb 13, 2022
@deshartman
Copy link
Author

Looks like the changes to the code for the emo has definitely introduced an issue with the static adapter. Any word on how to fix this or work around it?

@geoffrich
Copy link
Member

I'm not sure why I don't see this in other people's reproductions, but when attempting to reproduce with the latest kit/adapter-static I get the following error message: "Cannot prerender pages that have shadow endpoints with mutative methods"

> Using @sveltejs/adapter-static
Error: Cannot prerender pages that have shadow endpoints with mutative methods
    at load_shadow_data (file:///home/grich/git/repro/static-build-repro/.svelte-kit/output/server/app.js:1326:13)
    at async load_node (file:///home/grich/git/repro/static-build-repro/.svelte-kit/output/server/app.js:1120:28)
    at async respond$1 (file:///home/grich/git/repro/static-build-repro/.svelte-kit/output/server/app.js:1523:22)
    at async render_page (file:///home/grich/git/repro/static-build-repro/.svelte-kit/output/server/app.js:1660:20)
    at async resolve (file:///home/grich/git/repro/static-build-repro/.svelte-kit/output/server/app.js:1847:105)
    at async Object.handle (file:///home/grich/git/repro/static-build-repro/.svelte-kit/output/server/app.js:1933:20)
    at async respond (file:///home/grich/git/repro/static-build-repro/.svelte-kit/output/server/app.js:1778:22)
    at async visit (file:///home/grich/git/repro/static-build-repro/node_modules/@sveltejs/kit/dist/chunks/index5.js:553:20)
> 500 /todos
    at file:///home/grich/git/repro/static-build-repro/node_modules/@sveltejs/kit/dist/chunks/index5.js:437:11
    at save (file:///home/grich/git/repro/static-build-repro/node_modules/@sveltejs/kit/dist/chunks/index5.js:669:4)
    at visit (file:///home/grich/git/repro/static-build-repro/node_modules/@sveltejs/kit/dist/chunks/index5.js:562:3)
    at processTicksAndRejections (internal/process/task_queues.js:95:5)

This error makes sense to me - the demo app needs to handle post/put/delete requests at runtime, so it can't prerender the whole app. This means it won't work with adapter static, and the adapter is working as expected.

I can't understand how it would have ever worked with adapter-static, even before shadow endpoints were introduced. Even if the build succeeded, it wouldn't work at runtime since there isn't a way for a prerendered app to set cookies and store todos for a given user. Am I missing something?

@deshartman
Copy link
Author

deshartman commented Feb 15, 2022 •
edited
Loading

@geoffrich It definitely worked with the older code. The issue was introduced when the code was changed. To be clear, when I say worked, the page rendered, but you could not add any todo items. With the new code, the page does not even render, just shows an error.

Old code had the below files:

image

While the new release has changed these to:

image

I have tested both and the old code deploys and runs without issue, while the new code chokes with 500 error

@robots4life
Copy link

Just tried again. With npm i @sveltejs/adapter-static@1.0.0-next.28 I now also have the Error: Cannot prerender pages that have shadow endpoints with mutative methods error for the TS as well as non TS version on npm run build. Both versions run fine with npm run dev.

@geoffrich
Copy link
Member

I guess I don't understand what the issue is here. Yes, you could build the demo app with the static adapter before. However, the built app was then non-functional, since you couldn't interact with the todo list without the server handlers. It's a good thing that you are now made aware at build time that the production app will not function properly. If you want to build the demo app, you need to use an adapter that supports server endpoints at runtime, which the static adapter does not. The build-time error is expected and desired in this case.

Is there a SvelteKit app besides the demo app that should work with the static adapter and no longer does post the introduction of shadow endpoints?

@indaco
Copy link

indaco commented Feb 16, 2022 •
edited
Loading

UPDATE now both are on latest v275

  • update the svelte.config.js
...
kit: {
   trailingSlash: 'always',
   adapter: adapter(),
   prerender: {
	entries: ['*']
}
...
}
  • fixed the links on markdown (mdsvex) pages to avoid /404 during the build with adapter static

I have a couple of public websites ( sveltin.io and docs.sveltin.io ) using the static adapter.

Both work with sveltekit@1.0.0-next.264 and adaper-static@1.0.0-next.28

With sveltekit@1.0.0-next.265 and higher, the build process is ok but that the routing is affected (as per #3852 linked to this issue)

trailingSlash to any valid option does not work for me too.

adapter-static seems to me to be not aware of the "Pass trailingSlash config to adapters"(#3820) like the vercel one

So far, I have to revert to sveltekit@1.0.0-next.264

Happy to share more info on it

@geoffrich
Copy link
Member

I'm going to close this since the demo app is working as expected. If you are having problems with apps besides the demo app, please open a separate issue.

@deshartman
Copy link
Author

Added kit lines @indaco suggested and now at least it builds. Thanks!

@StathisKap
Copy link

How can I get the adapter to work with TS? I get this error when I run npm run build


> stathis-site@0.0.1 build
> vite build

polyfillModulePreload is deprecated. Use modulePreload.polyfill instead.
vite v3.2.0 building for production...
✓ 11 modules transformed.
[vite-plugin-svelte] /home/stathis/stathis-site/src/routes/Sidebar.svelte:4:10 Unexpected token
file: /home/stathis/stathis-site/src/routes/Sidebar.svelte:4:10
 2 |    import { svg_element } from 'svelte/internal';
 3 |    import Logo from './Logo.svelte';
 4 |    let pages: Array<string> = ['Projects', 'Contact'];
                 ^
 5 |    let links = {
 6 |      'GH.svg': 'https://github.com/StathisKap',
error during build:
ParseError: Unexpected token
    at error (file:///home/stathis/stathis-site/node_modules/svelte/compiler.mjs:17790:19)
    at Parser$1.error (file:///home/stathis/stathis-site/node_modules/svelte/compiler.mjs:17867:9)
    at Parser$1.acorn_error (file:///home/stathis/stathis-site/node_modules/svelte/compiler.mjs:17861:14)
    at Object.read_script [as read] (file:///home/stathis/stathis-site/node_modules/svelte/compiler.mjs:8796:16)
    at tag (file:///home/stathis/stathis-site/node_modules/svelte/compiler.mjs:16816:33)
    at new Parser$1 (file:///home/stathis/stathis-site/node_modules/svelte/compiler.mjs:17826:21)
    at parse$3 (file:///home/stathis/stathis-site/node_modules/svelte/compiler.mjs:17958:20)
    at compile (file:///home/stathis/stathis-site/node_modules/svelte/compiler.mjs:43309:17)
    at compileSvelte2 (file:///home/stathis/stathis-site/node_modules/@sveltejs/vite-plugin-svelte/dist/index.js:343:20)
    at async Object.transform (file:///home/stathis/stathis-site/node_modules/@sveltejs/vite-plugin-svelte/dist/index.js:1983:25)

@dummdidumm
Copy link
Member

Did you forget lang="ts" on the script tag?

@StathisKap
Copy link

yeah, all my script tags have lang=ts on them

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
6 participants
@indaco @geoffrich @dummdidumm @robots4life @deshartman @StathisKap