Bug Fix: Correctly Support > [!IMPORTANT]s and > [!CAUTION]s in Admonitions

[misaka10987]

Type of change

• Bug fix (a non-breaking change that fixes an issue)
• New feature (a non-breaking change that adds functionality)
• Breaking change (fix or feature that would cause existing functionality to not work as expected)
• Other (please describe):

Checklist

• I have read the CONTRIBUTING document.
• I have checked to ensure that this Pull Request is not for personal changes.
• I have performed a self-review of my own code.
• My changes generate no new warnings.

Related Issue

It is said that fuwari supports both markdown directives and the github syntax like > [!IMPORTANT] for admonition cards. However, for the github syntax, only > [!NOTE], > [!TIP] and > [!WARNING] function correctly and > [!IMPORTANT] and > [!CAUTION] do not.

This is because the remarkGithubAdmonitionsToDirectives used to support the github syntax generates :::infos and :::dangers, while fuwari expect that to be :::importants and :::cautions to render the admonitions.

Changes

Edit the config to adapt to the markdown directives generated by the remarkGithubAdmonitionsToDirectives .

How To Test

Write an > [!IMPORTANT] to any post.

For example, my post:

> [!IMPORTANT]
> 本项目被迁移至 [Cloudflare](https://efzgkb-g12-math.pages.dev/) , 原有 [Github Pages](https://misaka10987.github.io/site-efzgkb-g12-math) 链接作废。

Before

After

Screenshots (if applicable)

Additional Notes

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Preview	Comments	Updated (UTC)
fuwari-yags	Ready	Preview	Comment	Oct 1, 2025 2:13pm

[misaka10987]

The behavior of remarkGithubAdmonitionsToDirectives can be tested using the code given in its README.

import { remark } from "npm:remark";
import remarkDirective from "npm:remark-directive";
import remarkGithubAdmonitionsToDirectives from "npm:remark-github-admonitions-to-directives";

const processor = remark()
  .use(remarkGithubAdmonitionsToDirectives)
  .use(remarkDirective);

const result = processor.processSync(`
> [!NOTE]
> Note content.

> [!IMPORTANT]
> Important content.

> [!CAUTION]
> Caution content.
`);

console.log(result.toString());

This outputs

:::note
Note content.
:::

:::info
Important content.
:::

:::danger
Caution content.
:::