feat: get basic version posts index etc working

This commit is contained in:
dusk 2024-08-08 03:33:36 +03:00
parent efcdacbb27
commit 188dc0124c
Signed by: dusk
SSH Key Fingerprint: SHA256:Abmvag+juovVufZTxyWY8KcVgrznxvBjQpJesv071Aw
13 changed files with 142 additions and 26 deletions

BIN
bun.lockb

Binary file not shown.

View File

@ -12,23 +12,32 @@
"format": "prettier --write ." "format": "prettier --write ."
}, },
"devDependencies": { "devDependencies": {
"@sveltejs/adapter-auto": "^3.0.0", "@sveltejs/adapter-auto": "^3.2.2",
"@sveltejs/kit": "^2.0.0", "@sveltejs/adapter-static": "^3.0.2",
"@sveltejs/vite-plugin-svelte": "^3.0.0", "@sveltejs/kit": "^2.5.20",
"@types/eslint": "^8.56.7", "@sveltejs/vite-plugin-svelte": "^3.1.1",
"eslint": "^9.0.0", "@types/eslint": "^8.56.11",
"autoprefixer": "^10.4.20",
"eslint": "^9.8.0",
"eslint-config-prettier": "^9.1.0", "eslint-config-prettier": "^9.1.0",
"eslint-plugin-svelte": "^2.36.0", "eslint-plugin-svelte": "^2.43.0",
"globals": "^15.0.0", "globals": "^15.9.0",
"prettier": "^3.1.1", "mdsvex": "^0.11.2",
"prettier-plugin-svelte": "^3.1.2", "postcss": "^8.4.41",
"svelte": "^4.2.7", "prettier": "^3.3.3",
"prettier-plugin-svelte": "^3.2.6",
"svelte": "^4.2.18",
"svelte-adapter-bun": "^0.5.2", "svelte-adapter-bun": "^0.5.2",
"svelte-check": "^3.6.0", "svelte-check": "^3.8.5",
"tslib": "^2.4.1", "tailwindcss": "^3.4.8",
"typescript": "^5.0.0", "tslib": "^2.6.3",
"typescript-eslint": "^8.0.0-alpha.20", "typescript": "^5.5.4",
"vite": "^5.0.3" "typescript-eslint": "^8.0.1",
"vite": "^5.4.0"
}, },
"type": "module" "type": "module",
"dependencies": {
"rehype-autolink-headings": "^7.1.0",
"rehype-slug": "^6.0.0"
}
} }

6
postcss.config.js Normal file
View File

@ -0,0 +1,6 @@
export default {
plugins: {
tailwindcss: {},
autoprefixer: {},
},
}

3
src/app.postcss Normal file
View File

@ -0,0 +1,3 @@
@tailwind base;
@tailwind components;
@tailwind utilities;

22
src/lib/convertDate.ts Normal file
View File

@ -0,0 +1,22 @@
const months = [
'Jan',
'Feb',
'Mar',
'Apr',
'May',
'Jun',
'Jul',
'Aug',
'Sep',
'Oct',
'Nov',
'Dec'
];
const convertDate = (published: string) => {
const date = published.substring(0, 10);
const [year, month, day] = date.split('-');
return `${day}-${months[parseInt(month) - 1]}-${year}`;
};
export default convertDate;

View File

@ -0,0 +1,5 @@
<script>
import "../app.postcss";
</script>
<slot />

2
src/routes/+layout.ts Normal file
View File

@ -0,0 +1,2 @@
export const ssr = true;
export const prerender = true;

View File

@ -1,2 +1 @@
<h1>Welcome to SvelteKit</h1> <a href="/posts" data-sveltekit-preload-data="hover">posts</a>
<p>Visit <a href="https://kit.svelte.dev">kit.svelte.dev</a> to read the documentation</p>

View File

@ -0,0 +1,17 @@
<script lang="ts">
export let data;
</script>
<div>
{#each data.posts as post}
<div>
<a href="/posts/{post.path}" data-sveltekit-preload-data="hover">
<p>{post.title}</p>
<p>{post.excerpt}</p>
</a>
<div>
<time datetime="2020-03-16">{post.published}</time>
</div>
</div>
{/each}
</div>

13
src/routes/posts/+page.ts Normal file
View File

@ -0,0 +1,13 @@
import convertDate from "$lib/convertDate";
export async function load({ params }) {
const allPostFiles: Record<string, any> = import.meta.glob('./*/+page.md', {eager: true});
const allPosts: any[] = Object.entries(allPostFiles).map(([path, post]) => {
const postPath = path.slice(2, -8);
return { ...post.metadata, path: postPath, published: convertDate(post.metadata.date) };
});
if (!allPosts.length) {
return { status: 404 };
}
return { posts: allPosts };
}

View File

@ -0,0 +1,17 @@
---
title: Hello World
author: Jeff
date: 2022-05-27
layout: blog
excerpt: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi eget massa sit amet arcu varius lacinia nec quis lacus.
---
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi eget massa sit amet arcu varius lacinia nec quis lacus. Proin auctor lectus a volutpat porta. Nullam eget ipsum convallis, elementum orci sodales, blandit velit. In imperdiet, ligula sed ultricies pharetra, metus mi consequat dui, vitae luctus dolor ligula eu nunc. Fusce consequat mauris ac egestas iaculis. Quisque pharetra et ante maximus convallis. Nulla sollicitudin velit molestie mauris dignissim, at hendrerit diam fringilla. Donec mollis eget ex non iaculis. In a vehicula nisl. Donec dapibus orci in enim posuere, non rhoncus risus ultrices. Pellentesque elementum metus ipsum, ut scelerisque mauris ultrices vel.
Aliquam ullamcorper est vehicula, suscipit nulla pellentesque, convallis odio. Praesent eget elit eget magna fringilla pharetra tempor quis magna. Proin et est vestibulum neque rhoncus mattis non vel lacus. Proin vulputate risus vel dignissim vestibulum. Quisque id sollicitudin neque, sed sagittis urna. Vestibulum vehicula metus sed eros venenatis, sit amet facilisis nunc porta. Nam pharetra luctus sapien, ut venenatis nibh tincidunt mollis. Phasellus efficitur, felis vitae mattis cursus, sapien diam vulputate dui, sit amet pulvinar ante ipsum non urna.
Fusce est nulla, efficitur vitae turpis eget, pretium rutrum turpis. Fusce at lectus eros. Phasellus convallis condimentum dolor ac rutrum. Integer commodo augue et dui efficitur tincidunt. Nam scelerisque egestas quam, vitae ultrices turpis tincidunt rhoncus. Duis rutrum placerat erat. Ut ac tincidunt elit. In laoreet dictum mauris nec posuere. Curabitur tempus, dolor malesuada ultrices feugiat, ipsum eros faucibus tellus, eu ultricies nunc est sed dolor. Suspendisse nisi eros, vehicula vitae iaculis sit amet, aliquet sit amet leo. Sed euismod urna at eros posuere laoreet. Curabitur in sodales lorem. Nulla rutrum aliquam felis ac tempor.
Ut pretium vitae elit ac facilisis. Aliquam nisi tortor, feugiat at lacus sed, condimentum egestas urna. Vestibulum hendrerit augue non urna volutpat, et fermentum tortor pellentesque. Aenean eget pharetra leo. Vestibulum ut laoreet dui. Phasellus nec nunc imperdiet, mollis urna eget, interdum lacus. Nulla ac neque pulvinar ex vestibulum venenatis at sed mi. Aliquam faucibus risus eget dolor porttitor interdum. Phasellus rutrum augue ex, vel tempus velit sollicitudin vitae. Pellentesque libero sapien, ullamcorper nec elementum nec, pharetra sed nisl. Nullam egestas arcu et ex vulputate, pretium vestibulum odio convallis. Nam auctor risus nec fermentum ultricies.
Donec porttitor quis ipsum ut imperdiet. Fusce ac pretium felis, sit amet pharetra orci. Donec vitae quam ac tellus pellentesque fringilla. Curabitur placerat quam a leo imperdiet tincidunt. Nunc porta pulvinar orci sit amet varius. Suspendisse dapibus ipsum nec magna ultricies gravida. Maecenas varius justo ac sem rhoncus lobortis. Integer eget cursus diam. Vestibulum sollicitudin enim at metus scelerisque blandit. In sit amet pulvinar nunc. Sed sit amet rutrum ex, efficitur imperdiet nunc.

View File

@ -1,17 +1,31 @@
import adapter from "svelte-adapter-bun"; import adapter from "@sveltejs/adapter-static";
import { vitePreprocess } from '@sveltejs/vite-plugin-svelte'; import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';
import { mdsvex } from 'mdsvex'
import rehypeAutolinkHeadings from 'rehype-autolink-headings'
import rehypeSlug from 'rehype-slug'
/** @type {import('@sveltejs/kit').Config} */ /** @type {import('@sveltejs/kit').Config} */
const config = { const config = {
// Consult https://kit.svelte.dev/docs/integrations#preprocessors extensions: ['.svelte', '.md', '.svx'],
// for more information about preprocessors
preprocess: vitePreprocess(), preprocess: [
vitePreprocess(),
mdsvex({
extensions: ['.md', '.svx'],
rehypePlugins: [
rehypeSlug,
rehypeAutolinkHeadings,
],
smartypants: { dashes: 'oldschool' },
layout: './src/routes/+layout.svelte',
}),
],
kit: { kit: {
// adapter-auto only supports some environments, see https://kit.svelte.dev/docs/adapter-auto for a list. adapter: adapter({
// If your environment is not supported, or you settled on a specific environment, switch out the adapter. precompress: true,
// See https://kit.svelte.dev/docs/adapters for more information about adapters. }),
adapter: adapter()
} }
}; };

9
tailwind.config.js Normal file
View File

@ -0,0 +1,9 @@
/** @type {import('tailwindcss').Config} */
export default {
content: ['./src/**/*.{html,js,svelte,ts}'],
theme: {
extend: {},
},
plugins: [],
}