ckeditor4 vue3 Download - ckeditor4 vue3 Download Download

ckeditor4 vue3

مكونات الطرف الثالث

v1.0.9

تنزيل

Ckeditor 4 Wysiwyg Editor Component لـ Vue.js V3

مكون محرر Ckeditor 4 WysiWyg لـ Vue.js V3.

التثبيت والاستخدام

لتثبيت مكون ckeditor 4 لـ Vue.js من NPM ، ما عليك سوى تشغيل:

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 >

استخدم عبر علامة `<script>` مباشرة

بدلاً من استخدام واردات ES6 ، يمكن أيضًا إضافة المكون عبر البرنامج النصي المباشر:

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

وتستخدم بنفس الطريقة كما هو الحال مع واردات ES6:

 app . use ( CKEditor ) ;

ارجع إلى وثائق مكون CKEDitor 4 VUE الرسمية لمزيد من المعلومات حول عملية التثبيت.

الوثائق والأمثلة

راجع مقالة CKEDITITION 4 WYSIWYG محرر VUE Integration في وثائق CKEDITOR 4.

يمكنك أيضًا الاطلاع على عينات تكامل محرر CKEDITITITION 4 WYSIWYG في أمثلة CKEDITOR 4.

دعم المتصفح

يعمل مكون Ckeditor 4 Vue مع جميع المتصفحات المدعومة باستثناء Internet Explorer.

لتمكين دعم Internet Explorer 11 ، بدلاً من الاستيراد القياسي الذي تحتاجه لاستيراد ملف dist/legacy.js .

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

ملاحظة : على الرغم من أن CKEDitor 4 يدعم إصدارات Internet Explorer الأقدم بما في ذلك IE8 و IE9 و IE10 ، إلا أن تكامل VUE مدعوم فقط في أحدث Internet Explorer 11.

المساهمة

بعد استنساخ هذا المستودع ، قم بتثبيت التبعيات اللازمة:

 npm install

تنفيذ الاختبارات

يجري:

 npm run test

إذا كنت ستقوم بتغيير الملفات المصدر (تلك الموجودة في src/ Directory) ، تذكر إعادة بناء الحزمة. يمكنك استخدام npm run develop من أجل القيام بذلك تلقائيًا.