prefetch links
This commit is contained in:
parent
18e8883063
commit
a2a2b4f200
31
src/lib/Link.svelte
Normal file
31
src/lib/Link.svelte
Normal file
@ -0,0 +1,31 @@
|
|||||||
|
<script>
|
||||||
|
import { page } from '$app/stores';
|
||||||
|
export let href;
|
||||||
|
let pageHost;
|
||||||
|
page.subscribe(p => pageHost = p.host); // apparently this works?
|
||||||
|
|
||||||
|
function isLocal(url) {
|
||||||
|
if (url.startsWith('/')) {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
|
||||||
|
try {
|
||||||
|
let parsed = new URL(url);
|
||||||
|
return parsed.host === pageHost;
|
||||||
|
}
|
||||||
|
catch {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<!-- we pass href explicitly so a11y doesn't scream at us -->
|
||||||
|
{#if isLocal(href)}
|
||||||
|
<a sveltekit:prefetch {href} {...$$props}>
|
||||||
|
<slot></slot>
|
||||||
|
</a>
|
||||||
|
{:else}
|
||||||
|
<a {href} {...$$props}>
|
||||||
|
<slot></slot>
|
||||||
|
</a>
|
||||||
|
{/if}
|
@ -1,9 +1,14 @@
|
|||||||
|
<script context="module">
|
||||||
|
import Link from './Link.svelte';
|
||||||
|
export { Link as a };
|
||||||
|
</script>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
export let meta, body;
|
export let title, date;
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
||||||
<div id="post">
|
<div id="post">
|
||||||
<h1>{meta.title}</h1>
|
<h1>{title}</h1>
|
||||||
<svelte:component this={body} />
|
<slot></slot>
|
||||||
</div>
|
</div>
|
||||||
|
@ -4,8 +4,7 @@
|
|||||||
let post = await import(`./_posts/${page.params.slug}.svx`);
|
let post = await import(`./_posts/${page.params.slug}.svx`);
|
||||||
return {
|
return {
|
||||||
props: {
|
props: {
|
||||||
meta: post.metadata,
|
post: post.default
|
||||||
body: post.default
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -19,8 +18,7 @@
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import Post from '$lib/Post.svelte';
|
export let post;
|
||||||
export let meta, body;
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<Post {meta} {body}></Post>
|
<svelte:component this={post} />
|
||||||
|
@ -22,4 +22,10 @@ are a pain, and it seems to be a pretty intractable problem.
|
|||||||
|
|
||||||
You know what aren't a pain, or at least not nearly to the same extent? Keys.
|
You know what aren't a pain, or at least not nearly to the same extent? Keys.
|
||||||
That's right, physical stick-em-in-a-lock-and-turn metal keys. They've been
|
That's right, physical stick-em-in-a-lock-and-turn metal keys. They've been
|
||||||
around since forever, and I doubt they'll be going anywhere any time soon.
|
around since forever, and I doubt they'll be going anywhere any time soon.
|
||||||
|
|
||||||
|
[External link](https://www.google.com)
|
||||||
|
|
||||||
|
[Internal link](/posts)
|
||||||
|
|
||||||
|
[Internal absolute link](http://localhost:3000/simpler-socketio)
|
@ -5,16 +5,14 @@
|
|||||||
const post = await import(`./_posts/${metadata.slug}.svx`);
|
const post = await import(`./_posts/${metadata.slug}.svx`);
|
||||||
return {
|
return {
|
||||||
props: {
|
props: {
|
||||||
meta: post.metadata,
|
post: post.default,
|
||||||
body: post.default,
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import Post from '$lib/Post.svelte';
|
export let post;
|
||||||
export let meta, body;
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<Post {meta} {body}></Post>
|
<svelte:component this={post} />
|
||||||
|
@ -4,7 +4,7 @@ import staticAdapter from '@sveltejs/adapter-static';
|
|||||||
|
|
||||||
const config = {
|
const config = {
|
||||||
extensions: ['.svelte', '.svx'],
|
extensions: ['.svelte', '.svx'],
|
||||||
preprocess: mdsvex(),
|
preprocess: mdsvex({layout: './src/lib/Post.svelte'}),
|
||||||
kit: {
|
kit: {
|
||||||
// hydrate the <div id="svelte"> element in src/app.html
|
// hydrate the <div id="svelte"> element in src/app.html
|
||||||
target: '#svelte',
|
target: '#svelte',
|
||||||
|
Loading…
x
Reference in New Issue
Block a user