ckeditor4 vue3

ckeditor 4 vue.js v3のwysiwygエディターコンポーネント

vue.js v3のckeditor 4 wysiwygエディターコンポーネント。

インストールと使用

npmからvue.jsのckeditor 4コンポーネントをインストールするには、単に実行するだけです。

npm install @mayasabha/ckeditor4-vue3

単一のファイルコンポーネントで使用します

< script setup>
	import { component as ckeditor } from ' @mayasabha/ckeditor4-vue3 '
</ script >

< template >
	< ckeditor ></ ckeditor >
</ template >

グローバルプラグインとして使用します

Vue.use()メソッドを呼び出して、 CKEditor vueのグローバルプラグインとして登録します。

 import Vue from 'vue' ;
import CKEditor from '@mayasabha/ckeditor4-vue3' ;

const app = Vue . createApp ( { } ) ;
app . use ( CKEditor ) ;

new Vue ( {
	// ... options
} )

テンプレートで<ckeditor />コンポーネントを使用します。

< template >
	< div id = " app " >
		< ckeditor value = " Hello, World! " ></ ckeditor >
	</ div >
</ template >

Direct <script>タグを介して使用します

ES6インポートを使用する代わりに、コンポーネントは直接スクリプトを介して追加することもできます。

 < script src =" ../node_modules/@mayasabha/ckeditor4-vue3/dist/ckeditor.js " > </ script >

ES6のインポートと同じ方法で使用されます。

 app . use ( CKEditor ) ;

インストールプロセスの詳細については、公式のCKEDITOR 4 VUEコンポーネントドキュメントを参照してください。

ドキュメントと例

Ckeditor 4 Wysiwyg Editor Vue IntegrationのCkeditor 4ドキュメントのCkeditor 4 Wysiwyg Editor Vue Integrationの記事を参照してください。

Ckeditor 4 Wysiwyg Editor Vue統合サンプルをCkeditor 4の例で確認することもできます。

ブラウザのサポート

CKEDITOR 4 VUEコンポーネントは、インターネットエクスプローラーを除くすべてのサポートされているブラウザで動作します。

Internet Explorer 11サポートを有効にするには、標準のインポートの代わりに、特定のdist/legacy.jsファイルをインポートする必要があります。

 import CKEditor from '@mayasabha/ckeditor4-vue3/dist/legacy.js'

注：CKEDITOR 4は、IE8、IE9、IE10などの古いインターネットエクスプローラーバージョンをサポートしていますが、VUE統合は最新のInternet Explorer 11でのみサポートされています。

貢献

このリポジトリをクローニングした後、必要な依存関係をインストールします。

 npm install

テストの実行

走る：

 npm run test

ソースファイル（ src/ディレクトリにあるもの）を変更する場合は、パッケージの再構築について忘れないでください。 npm run develop使用して、自動的に実行できます。

パッケージの構築

公開される準備ができているパッケージのミニ型バージョンを作成します。

 npm run build

ライセンス

Copyright（c）2003-2022、Cksource Holding sp。 z oo all rights reserved。

選択した次のライセンスのいずれかの条件に基づいてライセンスされています。

• GNU一般公開ライセンスバージョン2以降、
• GNU以下の一般公開ライセンスバージョン2.1以降、
• Mozilla Public Licenseバージョン1.1以降（「MPL」）。

ライセンスの詳細については、 LICENSE.mdファイルを確認してください。