From d3b5acd21f181138c1751ccc9d07a2c3bb72e868 Mon Sep 17 00:00:00 2001 From: Flower-F <78215016+Flower-F@users.noreply.github.com> Date: Mon, 17 Oct 2022 18:40:06 +0800 Subject: [PATCH] feat: emoji (#101) --- docs/en/api/config-extension.md | 1 + docs/en/guide/use-mdx.mdx | 14 ++++++++++++++ docs/zh/api/config-extension.md | 1 + docs/zh/guide/use-mdx.mdx | 14 ++++++++++++++ package.json | 1 + pnpm-lock.yaml | 15 +++++++++++++++ src/node/plugin-mdx/pluginMdxRollup.ts | 2 ++ 7 files changed, 48 insertions(+) diff --git a/docs/en/api/config-extension.md b/docs/en/api/config-extension.md index 9f710d95..ea0f2c43 100644 --- a/docs/en/api/config-extension.md +++ b/docs/en/api/config-extension.md @@ -134,6 +134,7 @@ The remark plugins that will be used to parse markdown files. There are followin - [remark-gfm](https://www.npmjs.com/package/remark-gfm): Parse common markdown syntaxes `GFM` (GitHub Flavored Markdown). - [remark-frontmatter](https://www.npmjs.com/package/remark-frontmatter): Parse front matter info in markdown files. - [remark-mdx-frontmatter](https://www.npmjs.com/package/remark-mdx-frontmatter): Parse front matter info in mdx files. +- [remark-gemoji](https://www.npmjs.com/package/remark-gemoji): Turn gemoji shortcodes `(:+1:)` into emoji (:+1:). You can also use this option to add some extra remark plugins. For example: diff --git a/docs/en/guide/use-mdx.mdx b/docs/en/guide/use-mdx.mdx index 99861f67..e6e1f3a2 100644 --- a/docs/en/guide/use-mdx.mdx +++ b/docs/en/guide/use-mdx.mdx @@ -101,6 +101,20 @@ This is a dangerous warning. `tip` as a custom container of the bottom-line type. ::: +## Emoji + +**Input:** + +````bash +:tada: :100: :laughing: +```` + +**Output:** + +:tada: :100: :laughing: + +The complete emoji list cound be found in the [Emoji Cheat Sheet](https://www.webfx.com/tools/emoji-cheat-sheet/). + ## Code Line Highlighting Island.js supports highlighting of specified code lines. You can specify line highlighting in any of the following ways. diff --git a/docs/zh/api/config-extension.md b/docs/zh/api/config-extension.md index 631c04fa..3edcb3cc 100644 --- a/docs/zh/api/config-extension.md +++ b/docs/zh/api/config-extension.md @@ -134,6 +134,7 @@ remark 和 rehype 插件的选项。 - [remark-gfm](https://www.npmjs.com/package/remark-gfm): 解析常用 markdown 语法 `GFM` (GitHub Flavored Markdown)。 - [remark-frontmatter](https://www.npmjs.com/package/remark-frontmatter): 解析 Markdown 文件中的 Front Matter 信息。 - [remark-mdx-frontmatter](https://www.npmjs.com/package/remark-mdx-frontmatter): 解析 MDX 文件中的 Front Matter 信息。 +- [remark-gemoji](https://www.npmjs.com/package/remark-gemoji): 将 gemoji 缩写 `(:+1:)` 转换为 emoji (:+1:)。 你还可以使用此选项添加一些额外的 remark 插件。例如： diff --git a/docs/zh/guide/use-mdx.mdx b/docs/zh/guide/use-mdx.mdx index 33a58e15..d416d2bf 100644 --- a/docs/zh/guide/use-mdx.mdx +++ b/docs/zh/guide/use-mdx.mdx @@ -105,6 +105,20 @@ title: Hello World `tip` 作为兜底类型的 `block` ::: +## Emoji + +**输入：** + +````bash +:tada: :100: :laughing: +```` + +**输出：** + +:tada: :100: :laughing: + +完整的表情列表可以在 [Emoji Cheat Sheet](https://www.webfx.com/tools/emoji-cheat-sheet/) 中查看。 + ## 指定代码行高亮 Island.js 支持指定代码行的高亮显示。你可以用以下任意方式指定代码行高亮。 diff --git a/package.json b/package.json index 2c6e4945..793ec446 100644 --- a/package.json +++ b/package.json @@ -95,6 +95,7 @@ "rehype-slug": "^5.0.1", "remark-directive": "^2.0.1", "remark-frontmatter": "^4.0.1", + "remark-gemoji": "^7.0.1", "remark-gfm": "^3.0.1", "remark-mdx-frontmatter": "^2.0.3", "sass": "^1.54.5", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index f908bf42..e405914f 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -77,6 +77,7 @@ specifiers: release-it: ^15.4.2 remark-directive: ^2.0.1 remark-frontmatter: ^4.0.1 + remark-gemoji: ^7.0.1 remark-gfm: ^3.0.1 remark-mdx-frontmatter: ^2.0.3 resolve: ^1.22.1 @@ -138,6 +139,7 @@ dependencies: rehype-slug: 5.0.1 remark-directive: 2.0.1 remark-frontmatter: 4.0.1 + remark-gemoji: 7.0.1 remark-gfm: 3.0.1 remark-mdx-frontmatter: 2.0.3 sass: 1.54.5 @@ -3799,6 +3801,10 @@ packages: resolution: {integrity: sha512-xckBUXyTIqT97tq2x2AMb+g163b5JFysYk0x4qxNFwbfQkmNZoiRHb6sPzI9/QV33WeuvVYBUIiD4NzNIyqaRQ==} dev: true + /gemoji/7.1.0: + resolution: {integrity: sha512-wI0YWDIfQraQMDs0yXAVQiVBZeMm/rIYssf8LZlMDdssKF19YqJKOHkv4zvwtVQTBJ0LNmErv1S+DqlVUudz8g==} + dev: false + /gensync/1.0.0-beta.2: resolution: {integrity: sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==} engines: {node: '>=6.9.0'} @@ -6702,6 +6708,15 @@ packages: unified: 10.1.2 dev: false + /remark-gemoji/7.0.1: + resolution: {integrity: sha512-vhjuntkvYxRgM4Um6L5N7B3SrNu3eX6jNqpqAywpAvSYPbmDPNL3I5E6zWm+KPCyh3OpKRc5OPnz7SifggzePw==} + dependencies: + '@types/mdast': 3.0.10 + gemoji: 7.1.0 + unified: 10.1.2 + unist-util-visit: 4.1.1 + dev: false + /remark-gfm/3.0.1: resolution: {integrity: sha512-lEFDoi2PICJyNrACFOfDD3JlLkuSbOa5Wd8EPt06HUdptv8Gn0bxYTdbU/XXQ3swAPkEaGxxPN9cbnMHvVu1Ig==} dependencies: diff --git a/src/node/plugin-mdx/pluginMdxRollup.ts b/src/node/plugin-mdx/pluginMdxRollup.ts index 5dfd0d8a..8ad7a174 100644 --- a/src/node/plugin-mdx/pluginMdxRollup.ts +++ b/src/node/plugin-mdx/pluginMdxRollup.ts @@ -4,6 +4,7 @@ import remarkPluginGFM from 'remark-gfm'; import remarkPluginFrontMatter from 'remark-frontmatter'; import remarkDirective from 'remark-directive'; import remarkPluginMDXFrontMatter from 'remark-mdx-frontmatter'; +import remarkGemoji from 'remark-gemoji'; import { remarkPluginNormalizeLink } from './remarkPlugins/link'; import rehypePluginAutolinkHeadings from 'rehype-autolink-headings'; import rehypePluginSlug from 'rehype-slug'; @@ -29,6 +30,7 @@ export async function pluginMdxRollup( // The following two plugin for frontmatter remarkPluginFrontMatter, [remarkPluginMDXFrontMatter, { name: 'frontmatter' }], + remarkGemoji, remarkPluginToc, remarkDirective, remarkPluginTip,