@hideoo/astro-loader-npm-packages
v0.1.1
Published
Astro Content Layer loader to load npm packages from a given author.
Downloads
18
Maintainers
Readme
Features
A loader for the experimental Astro Content Layer API using the npm public registry search API to load all packages from a given author.
[!IMPORTANT] The Astro Content Layer API and this loader are experimental and subject to change.
Installation
Install the package using your package manager:
npm i @hideoo/astro-loader-npm-packages
Configuration
To use this loader, enable the experimental Content Layer API in your Astro project by editing your astro.config.mjs
file:
export default defineConfig({
+ experimental: {
+ contentLayer: true,
+ },
});
You can then use the loader in your Content Layer configuration located in the src/content/config.ts
file:
import { npmPackagesLoader } from '@hideoo/astro-loader-npm-packages'
import { defineCollection } from 'astro:content'
// Define a collection using the loader.
const packages = defineCollection({
loader: npmPackagesLoader({
// The author to load packages from.
author: 'hideoo',
}),
})
export const collections = { packages }
Usage
To query and render the loaded packages, you can use the same API as content collections:
---
import { getCollection } from 'astro:content'
const packages = await getCollection('packages')
---
<ul>
{
packages.map(({ data, id }) => (
<li>
<a href={`/pkg/${id}/`}>{data.package.name}</a>
</li>
))
}
</ul>
To learn more about querying and rendering, check the Astro Content Layer API documentation.
License
Licensed under the MIT License, Copyright © HiDeoo.
See LICENSE for more information.