carta

カルタ

モダンで軽量で強力なマークダウンエディター。

ドキュメント・Github

導入

注記

CARTAは最近v4に更新されました。これには、多数の大きな変更があります。

プロジェクトを更新するには、移行ガイドに従ってください。

CARTAは、軽量で高速で拡張可能なSvelte Markdownエディターおよび視聴者です。統一された発言とrehypeを搭載しています。例をご覧ください。ほとんどの編集者とは異なって、CARTAにはコードエディターは含まれていませんが、構文の強調表示、ショートカットなどを備えた単なるテキストアレアです。

特徴

• ？ Markdown Syntax Highlighting（Shiki）;
• ツールバー（拡張可能）;
• Keyboardショートカット（拡張可能）;
• ？発言のおかげで150以上のプラグインをサポートします。
• ？スクロール同期;
• ✅アクセシビリティフレンドリー;
• SSR互換性。
• Katexサポート（プラグイン）;
• ？スラッシュコマンド（プラグイン）;
• ？ emojis 、含まれている検索（プラグイン）が含まれています。
• tikzサポート（プラグイン）;
• 添付サポート（プラグイン）;
• ⚓見出しのアンカーリンク（プラグイン）;
• ？コードブロック構文ハイライト（プラグイン）をブロックします。
• 埋め込みコンポーネント（プラグイン）;

パッケージ

パッケージ	状態	ドキュメント
カルタ-MD		/
プラグインマス		/プラグイン/数学
プラグインコード		/プラグイン/コード
プラグインエモジ		/プラグイン/絵文字
プラグインスラッシュ		/プラグイン/スラッシュ
プラグインティク		/プラグイン/Tikz
プラグインアタッチメント		/プラグイン/添付ファイル
プラグインアンカー		/プラグイン/アンカー
プラグインコンポーネント		/プラグイン/コンポーネント

コミュニティプラグイン

プラグイン	説明
Carta-Plugin-Video	オンラインビデオをレンダリングします
Carta-Plugin-Imsize	特定のサイズで画像をレンダリングします
Carta-Plugin-Subscript	レンダリングサブスクリプトと上付き文字
カルタプラギンインズ - デル	<ins>および<del>タグサポート

はじめる

警告

消毒はカルタによって扱われません。オプションにsanitizerを提供する必要があります。一般的なサニタイザーは、同型非複合（提案）およびSanitize-HTMLです。例のドキュメントをチェックアウトします。

インストール

コアパッケージ：

 npm i carta-md

プラグイン：

 npm i @cartamd/plugin-name

基本的な構成

< script lang = " ts " >
	import { Carta , MarkdownEditor } from ' carta-md ' ;
	// Component default theme
	import ' carta-md/default.css ' ;

	const carta = new Carta ({
		// Remember to use a sanitizer to prevent XSS attacks
		// sanitizer: mySanitizer
	});
</ script >

< MarkdownEditor { carta } />

< style >
	/* Or in global stylesheet */
	/* Set your monospace font (Required to have the editor working correctly!) */
	:global( .carta-font-code ) {
		font-family : ' ... ' , monospace ;
		font-size : 1.1 rem ;
	}
</ style >

フラグ

次のVite構成を使用して、サーバー側のバンドルを削減できます。これにより、バンドルからシキが削除されます。ハイライターがそこに存在しなくなったため、サーバーでplugin-codeを使用しようとすると問題を引き起こす可能性があります。

 // vite.config.js
import { sveltekit } from '@sveltejs/kit/vite' ;

/** @type {import('vite').UserConfig} */
const config = {
	plugins : [ sveltekit ( ) ] ,
	define : {
		__ENABLE_CARTA_SSR_HIGHLIGHTER__ : false
	}
} ;
export default config ;

ドキュメント

完全なドキュメントについては、例、ガイド、およびその他のウェブサイトをチェックアウトします。

• 導入
• 例
• はじめる
• 編集スタイル
• プラグイン：
  • 数学
  • コード
  • 絵文字
  • スラッシュ
  • ティク
  • 添付ファイル
  • アンカー
  • 成分
• API：
  • ユーティリティ
  • コア
  • 拡大

貢献と開発

すべての貢献はよく受け入れられています。機能リクエストがある場合は、新しい問題を開くことができます。

このパッケージはPNPMワークスペースを使用するため、PNPMはすべてを適切にダウンロードしてまとめる必要があります。

コミット

このリポジトリは、コミットされたフレンドリーです。使用するには：

 npm run commit
# or, if you have commitizen installed globally
git cz

ドキュメントの実行

ドキュメントをプレビューしたい場合：

 cd docs
npm run dev