Add Mdsvex with svelte adder
npx svelte-add@latest mdsvex && npm i --save-dev mdsvex
const config = {
extensions: ['.svelte.md', '.md', '.svx'],
layout: {
blog: './src/lib/layouts/blog.svelte'
}
};
export default config;
Use <slot/>
to show the content of your markdown file
<script>
export let title = '';
export let description = '';
export let author = '';
export let date = '';
export let banner = ''
export let tags = [];
</script>
{title}
<br>
{tags}
<slot />
---
layout: blog
title: "A first blog post"
description: "Fusce ac lorem sit amet metus vestibulum dapibus ut at mauris. Etiam ut pulvinar nibh."
author: "Sveltekit Blogger"
date: "2021-09-08"
banner: "/images/blogs/a-second-post/banner.jpg"
tags: ["Svelte", "JavaScript", "Typescript", "web development", "Programming"]
---
## Lorem ipsum
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut volutpat, lacus et accumsan lobortis, justo sapien mattis felis, et lacinia ante libero ut augue. Etiam nec odio at erat commodo scelerisque. Phasellus convallis, mauris a tincidunt convallis, leo velit e
```jsx
const snapshot = await db.ref('views').once('value');
const views = snapshot.val();
const allViews = Object.values(views).reduce((total, value) => total + value);
# Style with Tailwindcss
## Install Tailwind css
```bash
npx svelte-add@latest tailwindcss
pnpm install @tailwindcss/typography
module.exports = {
plugins: [
require("@tailwindcss/typography")
]
};