I'm a front-end developer, currently at Deno (previously: Shopify).
I like building word games like, Quina and Hondo), and making things on CodePen. I also enjoy blogging on my website, where you can find more about me.
A preconfigured SvelteKit static blog starter, with Sass, Markdown, MDSvex, Rehype, background preloading, and more. See the README for full details.
Home Page: https://sveltekit-static-starter.netlify.app/
License: MIT License
I'm a front-end developer, currently at Deno (previously: Shopify).
I like building word games like, Quina and Hondo), and making things on CodePen. I also enjoy blogging on my website, where you can find more about me.
Hello, thanks for sharing this starter project.
I was looking at the RSS feed code and I saw this:
<atom:link href="https://${siteURL}/rss.xml" rel="self" type="application/rss+xml"/>
Isn't it supposed to point to the feed itself, which I believe is at /api/rss.xml
? So should it be:
<atom:link href="https://${siteURL}/api/rss.xml" rel="self" type="application/rss+xml"/>
?
hey @josh-collinsworth, I've been working to get my blog up and running but I've noticed that the pagination isn't working as expected. On my blog, I have six entries, the second page is indicated, but when I click it, I get redirected to the first page.
I also tried troubleshooting it with this original repo and I get the same redirect to the first page. any insights?
I cloned the repo today (the version that includes the PR to update deps to SK 1.0), installed the dependencies, committed and pushed to github.
Then I set up a project in vercel. I did nothing to the settings - build defaults to detecting SvelteKit and I adjusted none of the commands. I deployed.
Home page looks great! :)
But when I click on the blog link, I get a 500 error.
On refresh, the page renders as expected.
The same happens with every post inside of this page - initial 500, then displays.
This doesn't happen locally.
My next step is to test a local build and preview, but I'm running out of time this morning and wanted to get this issue written first.
I'll update with additional findings.
Hugo and many other static site generators provide multiple pre-built themes, like https://themes.gohugo.io/ that provides nearly 200 themes. This is really handy to quickly explore different styles and get started. I would be great to provide a plugin-like infrastructure that allows users to create a unified theme, so that people can start to write new themes. Once this is done, one can start to think about creating more themes and publishing them on some web pages.
I'm not sure what would be the best technical way to do this, but we can maybe let the user define an alias called mainTheme
to some module (say myGreatTheme
, that might either be installed via npm, or that is cloned from some repository, allowing the user to easily tweak minor theme options), maybe via https://www.npmjs.com/package/module-alias or maybe some sveltekit alias like https://medium.com/@rizqyhi/adding-new-path-alias-in-sveltekit-1127a1138e7 (to be honest I know very little about how modules work in js), so that later this library could run:
<script>
import { Header } from 'mainTheme'; // See that we use `mainTheme` here instead of `$lib/component`
// β¦
</script>
β¦
<Header someOptionalProps="foo">
β¦
</Header>
Ideally, you would also:
myGreatTheme
does not provide, say, Header
, then we use some default components for greater backward compatibilitymainTheme
comes in a dark and light style.I guess that one can get inspired by how flowbite or skeleton work to provide customizable components.
velte-kit/output/client/_app/immutable/nodes/5.lgHxx4ap.js 6.84 kB β gzip: 2.72 kB
.svelte-kit/output/client/_app/immutable/entry/app.6DZ-rLV4.js 6.93 kB β gzip: 2.36 kB
.svelte-kit/output/client/_app/immutable/chunks/index.T8xtbQjq.js 9.97 kB β gzip: 4.21 kB
.svelte-kit/output/client/_app/immutable/nodes/0.u6SMy1NS.js 11.77 kB β gzip: 4.32 kB
.svelte-kit/output/client/_app/immutable/chunks/README.qbVoyzal.js 21.19 kB β gzip: 7.48 kB
.svelte-kit/output/client/_app/immutable/entry/start.dDGYyjlR.js 27.86 kB β gzip: 11.20 kB
β built in 2.45s
301 /blog/page -> /blog
301 /blog/category/*/page/* -> /blog/category/*
301 /blog/category/page/* -> /blog
301 /blog/page/* -> /blog
SvelteKitError: Not found: /eyal.com/api/rss.xml
at resolve2 (file:///Users/eyal/Code/p_35_blog/.svelte-kit/output/server/index.js:2831:18)
at resolve (file:///Users/eyal/Code/p_35_blog/.svelte-kit/output/server/index.js:2663:34)
at #options.hooks.handle (file:///Users/eyal/Code/p_35_blog/.svelte-kit/output/server/index.js:2905:71)
at respond (file:///Users/eyal/Code/p_35_blog/.svelte-kit/output/server/index.js:2661:43) {
status: 404,
text: 'Not Found'
}
node:internal/event_target:1062
process.nextTick(() => { throw err; });
^
Error: 404 /eyal.com/api/rss.xml (linked from /)
To suppress or handle this error, implement `handleHttpError` in https://kit.svelte.dev/docs/configuration#prerender
at file:///Users/eyal/Code/p_35_blog/node_modules/@sveltejs/kit/src/core/config/options.js:201:13
at file:///Users/eyal/Code/p_35_blog/node_modules/@sveltejs/kit/src/core/postbuild/prerender.js:64:25
I'm getting the rss.xml error - any idea why? I do have the rountes/api/rss.xml/+server.js file in place (unchanged)
Just want to point this out because I think the build step is currently broken [with the latest HEAD at time of writing], but I'm curious if you're seeing different results.
Trying to figure out how to get sveltekit's prerendering to ignore all my api/ routes because they're not prerenderable?
I've set:
export const prerender = 'auto'
in my +layout.js hoping that would figure out the difference? true
and 'auto'
produce the same errors π
Error: api/rss.xml is not prerenderable
at render_endpoint (file:///Users/jasonkurian/src/github.com/jakxz/jakxz.github.io/.svelte-kit/output/server/index.js:461:11)
at resolve2 (file:///Users/jasonkurian/src/github.com/jakxz/jakxz.github.io/.svelte-kit/output/server/index.js:2370:28)
at async respond (file:///Users/jasonkurian/src/github.com/jakxz/jakxz.github.io/.svelte-kit/output/server/index.js:2429:12)
at async globalThis.fetch (file:///Users/jasonkurian/src/github.com/jakxz/jakxz.github.io/node_modules/.pnpm/@[email protected]_qevq5tvhizyxp44gfhkn6m3ljq/node_modules/@sveltejs/kit/src/core/prerender/prerender.js:130:21)
at async load (file:///Users/jasonkurian/src/github.com/jakxz/jakxz.github.io/.svelte-kit/output/server/entries/pages/_layout.js:5:17)
at async load_data (file:///Users/jasonkurian/src/github.com/jakxz/jakxz.github.io/.svelte-kit/output/server/index.js:1360:16)
at async file:///Users/jasonkurian/src/github.com/jakxz/jakxz.github.io/.svelte-kit/output/server/index.js:1901:18
Error: api/posts.json is not prerenderable
at render_endpoint (file:///Users/jasonkurian/src/github.com/jakxz/jakxz.github.io/.svelte-kit/output/server/index.js:461:11)
at resolve2 (file:///Users/jasonkurian/src/github.com/jakxz/jakxz.github.io/.svelte-kit/output/server/index.js:2370:28)
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
at async respond (file:///Users/jasonkurian/src/github.com/jakxz/jakxz.github.io/.svelte-kit/output/server/index.js:2429:12)
at async globalThis.fetch (file:///Users/jasonkurian/src/github.com/jakxz/jakxz.github.io/node_modules/.pnpm/@[email protected]_qevq5tvhizyxp44gfhkn6m3ljq/node_modules/@sveltejs/kit/src/core/prerender/prerender.js:130:21)
at async load (file:///Users/jasonkurian/src/github.com/jakxz/jakxz.github.io/.svelte-kit/output/server/entries/pages/blog/_page.server.js:2:19)
at async load_server_data (file:///Users/jasonkurian/src/github.com/jakxz/jakxz.github.io/.svelte-kit/output/server/index.js:1301:18)
at async file:///Users/jasonkurian/src/github.com/jakxz/jakxz.github.io/.svelte-kit/output/server/index.js:1876:18
I think i'm landing here in the build step
I have also tried putting
export const prerender = false;
in a +layout.server.js
and at the top of every one of the api/
+server.js
files with no luck.
With a bit of debugging it looks like my state.prerendering
object in the render_endpoint
method is:
{
"dependencies": {}
}
essentially empty.
Curious if you've run into this or figured out a way around it? I've asked around on the svelte discord as well but got nothing yet.
Hey @josh-collinsworth been trying to get components working properly in the markdown posts.
Currently they're able to import the HTML, but the CSS and JS elements are broken, or just plain don't import.
I've played around with the config - I believe the mdsvex()
needs to be preprocessed, but if I do that, it breaks pretty much everything. The blog index, the post page etc.
Any ideas/thoughts on how to get this working without breaking the blog?
First, I want to say thanks so much for your blog post and this blog starter. It's really helped me with learning more about svelte and sveltekit.
I was trying to build the website but I keep running into this problem below. I've tried troubleshooting but I'm not exactly sure what's going wrong here. Do you have any insights?
301 /blog/page -> /blog
file:///Users/teonbrooks/codespace/_websites/sveltekit-blog-starter/node_modules/@sveltejs/kit/src/core/prerender/prerender.js:429
throw new Error(
^
Error: The following routes were marked as prerenderable, but were not prerendered:
- api/posts/category/[category], - api/posts/page/[page], - blog/category/page/[page], - blog/page/[page], - blog/category/[category]/page, - blog/category/[category]/page/[page]
See https://kit.svelte.dev/docs/page-options#prerender-troubleshooting for more info
at prerender (file:///Users/teonbrooks/codespace/_websites/sveltekit-blog-starter/node_modules/@sveltejs/kit/src/core/prerender/prerender.js:429:9)
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
Node.js v18.0.0
[vite-plugin-svelte-kit] Prerendering failed with code 1
error during build:
Error: Prerendering failed with code 1
at ChildProcess.<anonymous> (file:///Users/teonbrooks/codespace/_websites/sveltekit-blog-starter/node_modules/@sveltejs/kit/src/exports/vite/index.js:438:15)
at ChildProcess.emit (node:events:527:28)
at ChildProcess._handle.onexit (node:internal/child_process:291:12)
Hi Josh. Thanks for this excellent repo. I'm a total noob with SvelteKit sorry if this is a dumb question. I am trying to publish my site to Cloudflare Pages.
I have changed
"@sveltejs/adapter-static": "^1.0.0-next.42",
to
"@sveltejs/adapter-cloudflare": "^1.0.0-next.38",
And then also used import adapter from '@sveltejs/adapter-cloudflare'
in svelte.config.js.
However, when Cloudflare builds the app it's borking with complaints about the pre-rendering. I guess this is because you've set things up to only support pre-rendering, and when I replaced adapter-static
with adapter-cloudflare
it's undoing your configuration.
Error: The following routes were marked as prerenderable, but were not prerendered:
--
08:10:15.125 | - api/posts/category/[category], - api/posts/page/[page], - blog/category/page/[page], - blog/page/[page], - blog/category/[category]/page, - blog/category/[category]/page/[page]
Please could you shed any light on what I'm doing wrong? Thank you.
It was stated that I only had to drop a .md file somewhere and it would be available automatically.
The conclusion I'm making is that "npm run build" has to be run every time I publish a new post.
I was hoping this project could be dropped at any file server, like Google Cloud Storage and work directly.
Like this static project, made with svelte:
https://storage.googleapis.com/bildbanken2/index.html
(I had to add index.html to the url, as it is not served by a web server.)
rss.xml
returns a 404
Β―_(γ)_/Β―
Could be an issue with Netlify, same happens on mine. (GitHub)
Tried clearing cache and redeploying but same thing. Log says it gets generated so idk.
2:26:54 AM: .svelte-kit/output/server/entries/endpoints/api/rss.xml/_server.js 1.52 KiB
I'm not currently able to render Svelte components inside of the posts that are pre-rendered at the build stage.
The postContent is compiled via an {@html data.postContent} tag, which seems to ignore the script and style tags and simply output the html. Or maybe not quite that, but the end result is that the component isn't functional inside of these post pages, just displayed.
Here is my repo showing this:
https://github.com/lakebayagency/test-boinger
Boinger is a component from the mdsvex playground: https://mdsvex.com/playground
To see the problem in action, go to the home page and observe that the boinger works fine inside of this page, which is rendered using a svelte:component tag.
Click the link below that, which will take you to a post that also references the Boinger component, but doesn't actually work.
Not sure what possible solutions are.
Problem: Changing the --accentFont
CSS Variable does not affect heading font-family
.
Root cause: Line 7 of _layout.scss
is causing the headings to inherit from the body text --primaryFont
CSS Variable.
Potential Solutions:
:where
declaration on Line 3 of _typography.scss
Problem: The width of the .callout
element is larger than the width of the screen, causing a resize and a white bar to appear on the right (visible in the header/footer of the page).
Root cause: Line 5 of _components.scss - the max width is unset.
Potential Solutions:
max-width: calc(100vw + 1rem);
- fixing the white bar on the right, but now having rounded corners visible only on the right side.width: calc(100% + 2rem);
and margin: 2rem -1rem 2rem -1rem;
accordingly, essentially making the callout fit the size of the screen. *This may require additional changes to the padding, depending on the desired look.I noticed that under the category section of my blog that it is not fully populated. I believe this is caused by the line below
when the posts.json is being fetched, it's being limited with the parameter postsPerPages, which only retrieves the first page of blog posts. However, to properly populate the category page, it needs to retrieve the entirety of posts.
It doesn't currently have a way to accept an argument
when i made it into a github page it did not look at all as the dev version
Hey, I noticed that in your footer component, the MainNav component is listed there but it doesn't appear in the build. I recently updated the base of my blog on the latest commits, and I noticed that the MainNav component is now missing in my footer as well.
Any suggestions to fix this?
I noticed that npm run build
fails on the tip of main:
user@machine:/tmp$ git clone [email protected]:josh-collinsworth/sveltekit-blog-starter.git
Cloning into 'sveltekit-blog-starter'...
remote: Enumerating objects: 1290, done.
remote: Counting objects: 100% (413/413), done.
remote: Compressing objects: 100% (138/138), done.
remote: Total 1290 (delta 316), reused 275 (delta 275), pack-reused 877
Receiving objects: 100% (1290/1290), 884.28 KiB | 2.26 MiB/s, done.
Resolving deltas: 100% (663/663), done.
user@machine:/tmp$ cd sveltekit-blog-starter/
user@machine:/tmp/sveltekit-blog-starter$ npm install
added 207 packages, and audited 208 packages in 1s
52 packages are looking for funding
run `npm fund` for details
1 high severity vulnerability
To address all issues, run:
npm audit fix
Run `npm audit` for details.
user@machine:/tmp/sveltekit-blog-starter$ npm run build
> [email protected] build
> vite build
vite v5.0.12 building SSR bundle for production...
β 119 modules transformed.
vite v5.0.12 building for production...
β 108 modules transformed.
.svelte-kit/output/client/_app/version.json 0.03 kB β gzip: 0.05 kB
.svelte-kit/output/client/.vite/manifest.json 9.13 kB β gzip: 1.02 kB
.svelte-kit/output/client/_app/immutable/chunks/each.-oqiv04n.js 0.07 kB β gzip: 0.09 kB
.svelte-kit/output/client/_app/immutable/chunks/index.oiCz_B55.js 0.11 kB β gzip: 0.12 kB
.svelte-kit/output/client/_app/immutable/nodes/11.pJKFA2UM.js 0.19 kB β gzip: 0.17 kB
.svelte-kit/output/client/_app/immutable/nodes/8.pJKFA2UM.js 0.19 kB β gzip: 0.17 kB
.svelte-kit/output/client/_app/immutable/chunks/config.9TwfRihT.js 0.30 kB β gzip: 0.22 kB
.svelte-kit/output/client/_app/immutable/chunks/control.pJ1mnnAb.js 0.34 kB β gzip: 0.21 kB
.svelte-kit/output/client/_app/immutable/chunks/Callout.G8ur-app.js 0.74 kB β gzip: 0.49 kB
.svelte-kit/output/client/_app/immutable/chunks/preload-helper.0HuHagjb.js 0.91 kB β gzip: 0.56 kB
.svelte-kit/output/client/_app/immutable/nodes/1.SS8rTGE5.js 1.42 kB β gzip: 0.81 kB
.svelte-kit/output/client/_app/immutable/nodes/4._25Q4NZo.js 1.44 kB β gzip: 0.77 kB
.svelte-kit/output/client/_app/immutable/nodes/2.jcRJ92rD.js 1.64 kB β gzip: 0.87 kB
.svelte-kit/output/client/_app/immutable/nodes/6.CeOQR6v9.js 1.83 kB β gzip: 0.97 kB
.svelte-kit/output/client/_app/immutable/nodes/3.QeNnDV5Q.js 1.99 kB β gzip: 1.04 kB
.svelte-kit/output/client/_app/immutable/nodes/7.2_yB7NYC.js 2.19 kB β gzip: 1.15 kB
.svelte-kit/output/client/_app/immutable/chunks/mdsvex-component-example.11C05Tzm.js 2.34 kB β gzip: 1.20 kB
.svelte-kit/output/client/_app/immutable/chunks/scheduler.Urk58y9q.js 2.37 kB β gzip: 1.12 kB
.svelte-kit/output/client/_app/immutable/nodes/12.fveUTNV4.js 2.77 kB β gzip: 1.33 kB
.svelte-kit/output/client/_app/immutable/nodes/10.Ap9OiEwe.js 2.77 kB β gzip: 1.33 kB
.svelte-kit/output/client/_app/immutable/chunks/singletons.yiWd7qOr.js 2.98 kB β gzip: 1.52 kB
.svelte-kit/output/client/_app/immutable/nodes/9.j_tp534v.js 3.08 kB β gzip: 1.47 kB
.svelte-kit/output/client/_app/immutable/nodes/13.B79RsLSY.js 3.10 kB β gzip: 1.41 kB
.svelte-kit/output/client/_app/immutable/chunks/heading-links-example.8k5nRDwS.js 3.27 kB β gzip: 1.28 kB
.svelte-kit/output/client/_app/immutable/chunks/Pagination.qBPI-jEN.js 4.82 kB β gzip: 2.06 kB
.svelte-kit/output/client/_app/immutable/chunks/syntax-highlighting-example.QUXGYAwc.js 6.00 kB β gzip: 1.93 kB
.svelte-kit/output/client/_app/immutable/nodes/5.0y2puOeF.js 6.15 kB β gzip: 2.59 kB
.svelte-kit/output/client/_app/immutable/entry/app.DfZb3kKz.js 6.93 kB β gzip: 2.37 kB
.svelte-kit/output/client/_app/immutable/chunks/index.GpMQ2F1a.js 9.97 kB β gzip: 4.21 kB
.svelte-kit/output/client/_app/immutable/nodes/0.Bp5Y4N42.js 11.85 kB β gzip: 4.30 kB
.svelte-kit/output/client/_app/immutable/chunks/README.4z_DNvg3.js 21.19 kB β gzip: 7.48 kB
.svelte-kit/output/client/_app/immutable/entry/start.NyYNPe7Q.js 27.86 kB β gzip: 11.20 kB
β built in 590ms
301 /blog/page -> /blog
301 /blog/category/*/page/* -> /blog/category/*
301 /blog/category/page/* -> /blog
301 /blog/page/* -> /blog
SvelteKitError: Not found: /example.com/api/rss.xml
at resolve2 (file:///tmp/sveltekit-blog-starter/.svelte-kit/output/server/index.js:2831:18)
at resolve (file:///tmp/sveltekit-blog-starter/.svelte-kit/output/server/index.js:2663:34)
at #options.hooks.handle (file:///tmp/sveltekit-blog-starter/.svelte-kit/output/server/index.js:2905:71)
at respond (file:///tmp/sveltekit-blog-starter/.svelte-kit/output/server/index.js:2661:43) {
status: 404,
text: 'Not Found'
}
node:internal/event_target:1100
process.nextTick(() => { throw err; });
^
Error: 404 /example.com/api/rss.xml (linked from /)
To suppress or handle this error, implement `handleHttpError` in https://kit.svelte.dev/docs/configuration#prerender
at file:///tmp/sveltekit-blog-starter/node_modules/@sveltejs/kit/src/core/config/options.js:201:13
at file:///tmp/sveltekit-blog-starter/node_modules/@sveltejs/kit/src/core/postbuild/prerender.js:64:25
at save (file:///tmp/sveltekit-blog-starter/node_modules/@sveltejs/kit/src/core/postbuild/prerender.js:399:4)
at visit (file:///tmp/sveltekit-blog-starter/node_modules/@sveltejs/kit/src/core/postbuild/prerender.js:232:3)
Emitted 'error' event on Worker instance at:
at [kOnErrorMessage] (node:internal/worker:326:10)
at [kOnMessage] (node:internal/worker:337:37)
at MessagePort.<anonymous> (node:internal/worker:232:57)
at [nodejs.internal.kHybridDispatch] (node:internal/event_target:826:20)
at exports.emitMessage (node:internal/per_context/messageport:23:28)
Node.js v20.11.0
user@machine:/tmp/sveltekit-blog-starter$
This does not happen with 5360246f6a30efa5ab0895033af7f1815b036aa2
.
When I do a git clone; cd repo; npm i; npm run build... it show the following error on missing file/folder...
.svelte-kit/output/server/index.js 80.14 kB
301 /blog/page -> /blog
301 /blog/category/page/* -> /blog
301 /blog/page/* -> /blog
node:fs:600
handleErrorFromBinding(ctx);
^
Error: ENOENT: no such file or directory, open 'C:\Users\xquis\Documents\develop\sveltekit-blog-starter.svelte-kit/output/prerendered/pages/api/posts/page/'
at Object.openSync (node:fs:600:3)
at writeFileSync (node:fs:2221:35)
at save (file:///C:/Users/xquis/Documents/develop/sveltekit-blog-starter/node_modules/@sveltejs/kit/src/core/prerender/prerender.js:348:4)
at visit (file:///C:/Users/xquis/Documents/develop/sveltekit-blog-starter/node_modules/@sveltejs/kit/src/core/prerender/prerender.js:212:3) {
errno: -4058,
syscall: 'open',
code: 'ENOENT',
path: 'C:\Users\xquis\Documents\develop\sveltekit-blog-starter\.svelte-kit/output/prerendered/pages/api/posts/page/'
}
Node.js v18.13.0
[vite-plugin-sveltekit-compile] Prerendering failed with code 1
error during build:
Error: Prerendering failed with code 1
at ChildProcess. (file:///C:/Users/xquis/Documents/develop/sveltekit-blog-starter/node_modules/@sveltejs/kit/src/exports/vite/index.js:551:15)
at ChildProcess.emit (node:events:513:28)
at ChildProcess._handle.onexit (node:internal/child_process:291:12)
PS C:\Users\xquis\Documents\develop\sveltekit-blog-starter>
This is a great example! Do you have any plans on updating this for the recent release of sveltekit 1.0?
Hello, I am pretty new to Svelte world and landed here following your awesome post on how to create a MD blog using sveltekit. Thank you for all the effort, I played around with the project in development mode and the level of time and effort put into this amazing work shows well.
When I try to build the project (after cloning it from github), it errors out with the following message. Any idea what I am doing wrong ?
Error message gives no clue as to what's missing.
Steps executed:
git clone https://github.com/josh-collinsworth/sveltekit-blog-starter.git
cd sveltekit-blog-starter
npm install
npm run dev
npm run build
. . .
.svelte-kit/output/server/chunks/README.js 11.28 KiB
301 /blog/page -> /blog
301 /blog/category/page/* -> /blog
301 /blog/page/* -> /blog
node:fs:585
handleErrorFromBinding(ctx);
^
Error: ENOENT: no such file or directory, open 'C:\Dev\nodejs\svelte-static-blog\sveltekit-blog-starter\.svelte-kit/output/prerendered/pages/api/posts/category/*'
at Object.openSync (node:fs:585:3)
at writeFileSync (node:fs:2155:35)
at save (file:///C:/Dev/nodejs/svelte-static-blog/sveltekit-blog-starter/node_modules/@sveltejs/kit/src/core/prerender/prerender.js:317:4)
at visit (file:///C:/Dev/nodejs/svelte-static-blog/sveltekit-blog-starter/node_modules/@sveltejs/kit/src/core/prerender/prerender.js:196:3) {
errno: -4058,
syscall: 'open',
code: 'ENOENT',
path: 'C:\\Dev\\nodejs\\svelte-static-blog\\sveltekit-blog-starter\\.svelte-kit/output/prerendered/pages/api/posts/category/*'
}
[vite-plugin-svelte-kit] Prerendering failed with code 1
error during build:
Error: Prerendering failed with code 1
at ChildProcess.<anonymous> (file:///C:/Dev/nodejs/svelte-static-blog/sveltekit-blog-starter/node_modules/@sveltejs/kit/src/exports/vite/index.js:443:15)
at ChildProcess.emit (node:events:520:28)
at Process.ChildProcess._handle.onexit (node:internal/child_process:291:12)
If it helps, this is the content of my package.json file:
{
"name": "sveltekit-blog-starter",
"version": "1.4.2",
"scripts": {
"dev": "vite dev",
"build": "vite build",
"preview": "vite preview",
"lint": "prettier --ignore-path .gitignore --check --plugin-search-dir=. . && eslint --ignore-path .gitignore .",
"format": "prettier --ignore-path .gitignore --write --plugin-search-dir=. ."
},
"devDependencies": {
"@sveltejs/adapter-static": "^1.0.0-next.42",
"@sveltejs/kit": "next",
"eslint": "^7.32.0",
"eslint-config-prettier": "^8.3.0",
"eslint-plugin-svelte3": "^3.2.1",
"mdsvex": "^0.9.8",
"prettier": "^2.4.1",
"prettier-plugin-svelte": "^2.4.0",
"rehype-autolink-headings": "^6.1.0",
"rehype-slug": "^5.0.0",
"sass": "^1.43.4",
"svelte": "^3.42.6",
"vite": "^3.1.0"
},
"type": "module",
"dependencies": {
"just-throttle": "^4.0.1",
"svelte-preprocess": "^4.9.8"
}
}
The purpose of key is to destroy what's inside it. I believe using this in the __layoout
is going to lead to some pretty hefty layout thrashing.
Thanks for creating this repo!
I just wanted you and other people who come across is about my fork which has these features:
/blog
instead of the top level so you can keep your main website separate.Simple fix to skip rendering "undefined" if your post doesn't have an excerpt:
{#if post.excerpt !== undefined}
{post.excerpt}
{/if}
When npm run dev it fails to start, with this error message:
"config.kit.target is no longer required, and should be removed"
Solution:
In svelte.config.js under "kit" remove target: '#svelte',
in line 33
Hey dude, so, been using your template to learn a bit of Sveltekit, thanks for all the work.
You'll notice the blog/category categories isn't correctly alphabetically sorted, here's the code I used to fix it:
const sortedUniqueCategories = Object.values(uniqueCategories).sort((a, b) => {
return a.title.localeCompare(b.title);
});
We are in the process of containerization a NodeJS application and running into an error when trying to install NodeJS (modules) dependencies using npm. The error message says, βECONNREFUSEDβ followed by the IP and 443 port number.
We initially thought that it might be due to the proxy configuration and set the proxy configuration to null; however, that has been ruled out and did not resolve the issue.
"npm config set proxy null
npm config set https-proxy null"
Please see the below contents of Dockerfile and the error message.
Any help or guidance you can provide would be greatly appreciated.
Thanks in advance!
Dockerfile:
FROM node
RUN mkdir /app
WORKDIR /app
COPY package*.json /app
RUN npm cache clear --force
RUN npm cache verify
#RUN npm config set proxy null
#RUN npm config set https-proxy null
RUN npm config set registry https://registry.npmjs.org/ --global
RUN npm config set strict-ssl false
RUN npm set maxsockets 3
RUN npm -version
RUN node -v
#RUN npm install
RUN npm install -g [email protected]
COPY . .
EXPOSE 5000
CMD [ "node", "app.js" ]
ERROR:
STEP 12/15: RUN npm install -g [email protected]
npm ERR! code ECONNREFUSED
npm ERR! syscall connect
npm ERR! errno ECONNREFUSED
npm ERR! FetchError: request to https://registry.npmjs.org/npm failed, reason: connect ECONNREFUSED 104.16.25.35:443
npm ERR! at ClientRequest. (/usr/local/lib/node_modules/npm/node_modules/minipass-fetch/lib/index.js:130:14)
npm ERR! at ClientRequest.emit (node:events:513:28)
npm ERR! at TLSSocket.socketErrorListener (node:_http_client:488:9)
npm ERR! at TLSSocket.emit (node:events:525:35)
npm ERR! at emitErrorNT (node:internal/streams/destroy:151:8)
npm ERR! at emitErrorCloseNT (node:internal/streams/destroy:116:3)
npm ERR! at process.processTicksAndRejections (node:internal/process/task_queues:82:21)
npm ERR! FetchError: request to https://registry.npmjs.org/npm failed, reason: connect ECONNREFUSED 104.16.25.35:443
npm ERR! at ClientRequest. (/usr/local/lib/node_modules/npm/node_modules/minipass-fetch/lib/index.js:130:14)
npm ERR! at ClientRequest.emit (node:events:513:28)
npm ERR! at TLSSocket.socketErrorListener (node:_http_client:488:9)
npm ERR! at TLSSocket.emit (node:events:525:35)
npm ERR! at emitErrorNT (node:internal/streams/destroy:151:8)
npm ERR! at emitErrorCloseNT (node:internal/streams/destroy:116:3)
npm ERR! at process.processTicksAndRejections (node:internal/process/task_queues:82:21) {
npm ERR! code: 'ECONNREFUSED',
npm ERR! errno: 'ECONNREFUSED',
npm ERR! syscall: 'connect',
npm ERR! address: '104.16.25.35',
npm ERR! port: 443,
npm ERR! type: 'system'
npm ERR! }
npm ERR!
npm ERR! If you are behind a proxy, please make sure that the
npm ERR! 'proxy' config is set properly. See: 'npm help config'
npm ERR! A complete log of this run can be found in:
npm ERR! /root/.npm/_logs/2022-11-29T18_24_19_209Z-debug-0.log
Error: error building at STEP "RUN npm install -g [email protected]": error while running runtime: exit status 1
Fairly new to the the world of Sveltekit but came up against this a few times today deploying on Vercel.
I don't know how this fits in with your setup, but I found the new adapter-auto
did the job fixing my prerendering issues. Maybe it'll work with the static one as well deployed sites?
In svelte.config.js
import adapter from '@sveltejs/adapter-auto';
and adding "@sveltejs/adapter-auto": "next",
to package.json.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
π Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. πππ
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google β€οΈ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.