Astro添加功能
记录一下 Astro 功能添加。
添加MDX支持
安装
自动添加
pnpm astro add mdx
手动添加
pnpm install @astrojs/mdx
需要修改astro.config.mjs
:
import { defineConfig } from 'astro/config';import mdx from '@astrojs/mdx';
export default defineConfig({ // ... integrations: [mdx()],});
编辑器集成
修改.vscode/settings.json
:
{ "files.associations": { "*.mdx": "markdown" }}
添加Sitemap支持
安装
自动添加
pnpm astro add sitemap
手动添加
pnpm install @astrojs/sitemap
需要修改astro.config.mjs
:
import { defineConfig } from 'astro/config';import sitemap from '@astrojs/sitemap';
export default defineConfig({ // ... integrations: [sitemap()],});
添加RSS支持
安装
pnpm install @astrojs/rss
使用
在src/pages/
中创建一个文件,其中包含你选择的名称和扩展名.xml.js
,以用作Feed
的输出 URL。一些常见的 RSS 源 URL 名称是feed.xml
或rss.xml
。
以rss.xml.js
为例(此处sanitizeHtml
和markdown-it
需要额外安装:pnpm install sanitize-html markdown-it
):
import rss from '@astrojs/rss';import { getCollection } from 'astro:content';import sanitizeHtml from 'sanitize-html';import MarkdownIt from 'markdown-it';const parser = new MarkdownIt();
export async function GET(context) { const blog = await getCollection('blog'); return rss({ title: 'Buzz’s Blog', description: 'A humble Astronaut’s guide to the stars', site: context.site, items: blog.map((post) => ({ link: `/blog/${post.slug}/`, // 注意:这不会处理 MDX 文件中的组件或 JSX 表达式。 content: sanitizeHtml(parser.render(post.body)), ...post.data, })), });}
需要修改
import { defineConfig } from 'astro/config';
// https://astro.build/configexport default defineConfig({ vite: { build: { rollupOptions: { external: ["sanitize-html","markdown-it"] } } },});
添加Mathjax支持
安装
pnpm install remark-parse remark-math rehype-mathjax rehype-stringify
使用
需要修改astro.config.mjs
:
import { defineConfig } from 'astro/config';import remarkParse from 'remark-parse';import remarkMath from 'remark-math';import rehypeMathjax from 'rehype-mathjax';import rehypeStringify from 'rehype-stringify';
// https://astro.build/configexport default defineConfig({ markdown: { remarkPlugins: [ remarkParse, remarkMath], rehypePlugins: [rehypeMathjax, rehypeStringify] },});
然后就可以正常使用mathjax了(注意行间公式的$$
应该都令取一行)。
如:
$\alpha_{1}+\alpha_{2}=\alpha{3}$
$$F=\frac{Gm_{1}m_{2}}{r^{2}}$$