diff --git a/README.md b/README.md index fa31fe1..2762ade 100644 --- a/README.md +++ b/README.md @@ -1,28 +1,13 @@ -# Vue JS Froala WYSIWYG Editor - -[![npm](https://img.shields.io/npm/v/vue-froala-wysiwyg.svg)](https://www.npmjs.com/package/vue-froala-wysiwyg) -[![npm](https://img.shields.io/npm/dm/vue-froala-wysiwyg.svg)](https://www.npmjs.com/package/vue-froala-wysiwyg) -[![npm](https://img.shields.io/npm/l/vue-froala-wysiwyg.svg)](https://www.npmjs.com/package/vue-froala-wysiwyg) - ->vue-froala-wyswiyg provides Vue bindings to the Froala WYSIWYG editor VERSION 3. - -## Compatibility - -- v1 later `@legacy` - - Vue.js 1.x -- v2 later - - Vue.js 2.x +# Vue3 Froala WYSIWYG Editor ## Installation -Install `vue-froala-wysiwyg` from `npm` +Install `froala-wysiwyg-vue3` from `npm` ```bash -npm install vue-froala-wysiwyg --save +npm install froala-wysiwyg-vue3 --save ``` - - ## Integration #### 1. Require and use Froala Editor component inside your application. @@ -40,19 +25,18 @@ import 'froala-editor/js/third_party/image_tui.min'; import 'froala-editor/css/froala_editor.pkgd.min.css'; // Import and use Vue Froala lib. -import VueFroala from 'vue-froala-wysiwyg' -Vue.use(VueFroala) -Vue.config.productionTip = false +import VueFroala from 'froala-wysiwyg-vue3'; -new Vue({ - render: h => h(App), - -}).$mount('#app') +const app = createApp({ + render: () => h(App) +}); +app.use(VueFroala); +app.mount('#app'); ``` #### App.vue file: -```javascript +```html