Hi,
I am trying to include an external component like Color Picker or CkEditor Component but they don’t work on vuejs+ionic app.
How can I import some external components or plugins on my vuejs 3 + ionic app?
Do you have any suggestion?
Can you show a code snippet of what you’ve attempted?
Hi have installed verte with npm install verte and inserted 3 lines of code like the example in my page, after i receive these errors:
<verte picker="square" model="rgb"></verte>
<ion-button size="full" @click="_addPost(form)" class="ion-margin-top">
Pubblica
</ion-button>
<script lang="ts">
import Verte from 'verte';
import 'verte/dist/verte.css';
main.ts
import { createApp } from "vue";
import { IonicVue } from "@ionic/vue";
/* Core CSS required for Ionic components to work properly */
import "@ionic/vue/css/core.css";
/* Basic CSS for apps built with Ionic */
import "@ionic/vue/css/normalize.css";
import "@ionic/vue/css/structure.css";
import "@ionic/vue/css/typography.css";
import App from "./App.vue";
import CKEditor from "@ckeditor/ckeditor5-vue";
createApp(App).use(IonicVue).use(CKEditor).mount("#app");
App.vue
<template>
<ion-app>
<ckeditor
:editor="editor"
v-model="editorData"
:config="editorConfig"
></ckeditor>
</ion-app>
</template>
<script lang="ts">
import { defineComponent } from "vue";
import { IonApp } from "@ionic/vue";
import ClassicEditor from "@ckeditor/ckeditor5-build-classic";
export default defineComponent({
name: "App",
components: {
IonApp,
},
data() {
return {
editor: ClassicEditor,
editorData: "<p>Content of the editor.</p>",
editorConfig: {
// The configuration of the editor.
},
};
},
});
</script>
<style>
</style>
CKEditor working example - vue 3 Ionic CKEditor - CodeSandbox
The color picker doesnt support vue3 - Vue 3 support · Issue #65 · baianat/verte · GitHub