diff --git a/astro.config.mjs b/astro.config.mjs index 59de232..b04b0e7 100644 --- a/astro.config.mjs +++ b/astro.config.mjs @@ -9,6 +9,7 @@ import image from '@astrojs/image'; import mdx from '@astrojs/mdx'; import partytown from '@astrojs/partytown'; import compress from 'astro-compress'; +import { readingTimeRemarkPlugin } from './src/utils/frontmatter.mjs'; import { SITE } from './src/config.mjs'; @@ -24,6 +25,10 @@ export default defineConfig({ output: 'static', + markdown: { + remarkPlugins: [readingTimeRemarkPlugin], + }, + integrations: [ tailwind({ config: { @@ -55,8 +60,6 @@ export default defineConfig({ }), ], - markdown: {}, - vite: { resolve: { alias: { diff --git a/src/components/blog/ListItem.astro b/src/components/blog/ListItem.astro index 47f23ca..4db21fb 100644 --- a/src/components/blog/ListItem.astro +++ b/src/components/blog/ListItem.astro @@ -43,13 +43,13 @@ const link = !BLOG?.post?.disabled ? getPermalink(post.permalink, 'post') : '';
- { post.category && ( <> - {' '} · + {' '} + ·{' '} {post.category.replaceAll('-', ' ')} diff --git a/src/components/blog/SinglePost.astro b/src/components/blog/SinglePost.astro index 2b0dd35..cf1559b 100644 --- a/src/components/blog/SinglePost.astro +++ b/src/components/blog/SinglePost.astro @@ -29,13 +29,14 @@ const { post, url } = Astro.props; post.category && ( <> {' '} - · + ·{' '} {post.category.replaceAll('-', ' ')} ) } + {' '}·{' '}{post.readingTime} min read

{ const getNormalizedPost = async (post: CollectionEntry<'post'>): Promise => { const { id, slug: rawSlug = '', data } = post; - const { Content } = await post.render(); + const { Content, remarkPluginFrontmatter } = await post.render(); const { tags: rawTags = [], @@ -60,6 +60,8 @@ const getNormalizedPost = async (post: CollectionEntry<'post'>): Promise = // or 'body' in case you consume from API permalink: await generatePermalink({ id, slug, publishDate, category }), + + readingTime: remarkPluginFrontmatter?.readingTime, }; }; diff --git a/src/utils/frontmatter.mjs b/src/utils/frontmatter.mjs index 67c1c1c..6da302f 100644 --- a/src/utils/frontmatter.mjs +++ b/src/utils/frontmatter.mjs @@ -1,12 +1,11 @@ import getReadingTime from 'reading-time'; import { toString } from 'mdast-util-to-string'; -export function remarkReadingTime() { +export function readingTimeRemarkPlugin() { return function (tree, file) { - const text = toString(tree); - const readingTime = Math.ceil(getReadingTime(text).minutes); + const textOnPage = toString(tree); + const readingTime = Math.ceil(getReadingTime(textOnPage).minutes); - const { frontmatter } = file.data.astro; - frontmatter.readingTime = readingTime; + file.data.astro.frontmatter.readingTime = readingTime }; }