Overview
Vuetify Pro Tiptap is a WYSIWYG rich-text editor for Vue.js that utilizes tiptap and vuetify. It offers features like Vuetify components, out-of-the-box extensions, markdown support, TypeScript support, and internationalization (I18n) support. The editor is compatible with Vuetify 3.x and Vue 3.x, as well as Vuetify 2.x.
Features
- Vuetify Components: Utilizes Vuetify components for a seamless experience.
- Out of Box Extensions: Offers multiple extensions with the ability to request more.
- Markdown Support: Supports markdown formatting within the editor.
- TypeScript Support: Compatible with TypeScript for improved development workflow.
- I18n Support: Supports multiple languages including English, Chinese (Simplified), and Dutch.
- Vuetify 3.x and Vue 3.x Support: Compatible with the latest versions of Vuetify and Vue.
Installation
To install Vuetify Pro Tiptap, follow these steps:
NPM installation:
npm install vuetify-pro-tiptap
Global Settings:
- For Vuetify 2.x usage, use the latest version of
vuetify-pro-tiptap@1.X.X
.
- For Vuetify 2.x usage, use the latest version of
Extensions:
- Declare the necessary extensions to add corresponding command-buttons in the editor.
Custom Theme:
- Create a custom theme using the provided SCSS file.
- Import the custom theme in the component for usage.
Summary
Vuetify Pro Tiptap is a feature-rich WYSIWYG rich-text editor built for Vue.js developers. With support for Vuetify components, out-of-the-box extensions, markdown formatting, TypeScript, and internationalization, it offers a comprehensive solution for creating rich-text editing experiences. By following the installation guide and leveraging the customizable features, developers can enhance their applications with a powerful text editor seamlessly integrated into their Vue.js projects.