Quartzのプラグインに慣れるため、rhysd/remark-emoji: Remark markdown transformer to replace in textを組み込んでみる。
型に関するエラーが出ているが、プラグイン自体は動作している。
package.jsonへremark-emojiパッケージを追加
"remark-emoji": "^4.0.1",
追加後npm install
する。
プラグインファイルを作成
quartz/plugins/transformers/emoji.ts
を作成する。
import { QuartzTransformerPlugin } from "../types"
import remarkEmoji from "remark-emoji"
export const Emoji: QuartzTransformerPlugin = () => {
return {
name: "Emoji",
markdownPlugins() {
return [remarkEmoji]
},
}
}
エクスポート設定
quartz/plugins/transformers/index.ts
へ以下を追加する。
export { Emoji } from "./emoji"
configファイルの設定
quartz.config.ts
のplugins: transformers: [
へ以下を追加する。
Plugin.Emoji(),
以上でMarkdown中に :dog:
などと書くと🐶に展開される。
エラーメッセージ
プラグインは動作しているがVSCodeで以下のエラーになっている。対応要
型 '() => { name: string; markdownPlugins(): Plugin<[(RemarkEmojiOptions | null | undefined)?], Root>[]; }' を型 'QuartzTransformerPlugin' に割り当てることはできません。
呼び出しシグネチャの戻り値の型 '{ name: string; markdownPlugins(): Plugin<[(RemarkEmojiOptions | null | undefined)?], Root>[]; }' と 'QuartzTransformerPluginInstance' には互換性がありません。
'markdownPlugins(...)' によって返された型は、これらの型同士で互換性がありません。
型 'Plugin<[(RemarkEmojiOptions | null | undefined)?], Root>[]' を型 'PluggableList' に割り当てることはできません。
型 'Plugin<[(RemarkEmojiOptions | null | undefined)?], Root>' を型 'Pluggable<any[]>' に割り当てることはできません。
型 'Plugin<[(RemarkEmojiOptions | null | undefined)?], Root>' を型 'Plugin<any[], any, any>' に割り当てることはできません。
各シグネチャの 'this' 型に互換性がありません。
型 'Processor<void, any, void, void> | Processor<void, any, any, any> | Processor<any, any, void, void> | Processor<void, void, void, void>' を型 'Processor<undefined, undefined, undefined, undefined, undefined>' に割り当てることはできません。
型 'Processor<void, any, void, void>' には 型 'Processor<undefined, undefined, undefined, undefined, undefined>' からの次のプロパティがありません: compiler, freezeIndex, frozen, namespace、3 など。