shikitor

Shikitor（四季多）

説明

Webのシンプルで軽量のコードエディター。

| en-us | 中文|

使い方

CDN

ツールを体験したい多くのユーザーにとって、CDNは良い選択です。このツールをプロジェクトに直接紹介し、使用を開始できます。使用習慣が異なる場合があります。ここでは、このツールを紹介するためのいくつかの簡単な方法を提供します。以下は、いくつかの単純な例のリンクです。クリックして対応するファイルを表示できます。

• ESM

  ESMは良い選択であり、インポート構文を使用してプロジェクトにこのツールを導入できます。これは、シキのデフォルトエクスポート方法でもあり、使用するのに比較的便利です。

• ESM +プラグイン

  機能のプラグ性は、常に私のコードデザイン哲学の非常に重要な部分でした。ここでは、関数拡張プラグインを導入する方法を見ることができます。

• umd

  ESMを使用したくない場合は、UMDが良い選択かもしれません。スクリプトタグを使用して、プロジェクトにこのツールを導入できます。 （しかし、実際、シキにとって、それは良い例ではないかもしれません、私はそれをより良くするために時間が必要ですUMDの利点を反映します）

node.js

このツールをコンピレーションプロセスで使用したいユーザーの場合、パッケージ管理を通じて依存関係をインストールし、このツールをコードに導入する方が良いかもしれません。

• 依存関係をインストールします

npm install @shikitor/core
# If you are using yarn
yarn add @shikitor/core

• コードに紹介します

 import '@shikitor/core/index.css'

import { create } from '@shikitor/core'

const shikitor = create ( document . getElementById ( 'editor' ) , {
  value : 'console.log("Hello, Shikitor!")' ,
  language : 'javascript' ,
  theme : 'github-light'
} ) 

特徴

キーボードショートカット

Tab / Shift + Tab ：インデント /アウトテント

Tabを使用して、現在の行または選択した行をインデントし、 Shift + Tabを使用して外にすることができます。

• プラグイン： @shikitor/core/plugins/code-styler
• デモ

クイックジャンプ

• プラグイン： @shikitor/core/plugins/code-styler
• Cmd/Ctrl + ⬅️/➡️ ：ラインの開始/終了にジャンプします
  • デモ

マウスの相互作用

カーソル位置のラインを強調表示します

• プラグイン：バンドル
• デモ

クロージングブラケットを強調表示します

• プラグイン： @shikitor/core/plugins/bracket-matcher
• デモ

プラグインシステム

建物...

ライセンス

mit