astro-loader-hashnode
v1.2.1
Published
Astro content loader for seamlessly integrating Hashnode blog posts into your Astro website using the Content Layer API
Maintainers
Readme
astro-loader-hashnode
Astro content loader for seamlessly integrating Hashnode blog posts into your Astro website using the Content Layer API.
Installation
npm install astro-loader-hashnode
# or
pnpm add astro-loader-hashnode
# or
yarn add astro-loader-hashnodeQuick Start
// src/content.config.ts
import { defineCollection } from 'astro:content';
import { hashnodeLoader } from 'astro-loader-hashnode';
export const collections = {
blog: defineCollection({
loader: hashnodeLoader({
publicationHost: 'your-blog.hashnode.dev',
}),
}),
};Features
- 🚀 Easy Setup - One-line configuration to get started
- 📝 Rich Content - Full post content, metadata, and assets
- 🔄 Multiple Loaders - Posts, series, drafts, and search
- 🎯 Type Safety - Full TypeScript support
- ⚡ Performance - Built-in caching and pagination
- 🛠️ Utilities - SEO helpers, content processing, and more
- 🧪 Schema Exposure - Built-in Zod schema exported to Astro for type inference
- 🧵 Incremental Updates - Digest-based change detection to skip unchanged entries
- 🖨️ Pre-render Support - Each entry includes
rendered.htmlso you can use Astro'srender(entry)API - 📌 Post Preferences - Access Hashnode preferences like
pinnedToBlogandisDelisted
Documentation
Visit our documentation for detailed usage instructions and examples.
Rendering Content
Astro can render an entry via render(entry). Because the loader now supplies a rendered field (HTML + metadata), you
can also directly set HTML:
---
import { getEntry } from 'astro:content';
const post = await getEntry('blog', 'my-post-slug');
const { data, render } = post;
// Option 1: use pre-rendered HTML
const html = data.content.html;
// Option 2: let Astro render (works if markdown available)
const rendered = await render();
---
<article set:html={html} />Preferences Fields
Some extra post preference flags are included when present on Hashnode:
data.preferences?.pinnedToBlog; // boolean | undefined
data.preferences?.isDelisted; // boolean | undefinedChange Detection (Digest)
Each stored entry includes a digest used internally to skip unchanged items on subsequent loads, improving build performance.
License
MIT © Mrugesh Mohapatra
