Conit Editor

A React-based editor library for Vue apps.

Installation

npm install conit-editor

Usage

Basic Usage

import { createConitEditor } from 'conit-editor'

const editor = createConitEditor({
  // editor options
})

Importing Styles

You have two options to import the CSS styles:

Option 1: Import CSS separately (recommended)

// Import the CSS file
import 'conit-editor/styles'

// Import the editor
import { createConitEditor } from 'conit-editor'

Option 2: CSS is automatically included

The CSS is automatically imported when you import the main module, so you can just use:

import { createConitEditor } from 'conit-editor'

Vue 프로젝트에서 사용하기

Vue 프로젝트에서 conit-editor를 사용할 때는 다음과 같이 할 수 있습니다:

<template>
  <div>
    <div ref="editorContainer"></div>
  </div>
</template>

<script setup>
import { ref, onMounted } from 'vue'
import { createConitEditor } from 'conit-editor'
import 'conit-editor/styles' // CSS 파일 import

const editorContainer = ref(null)

onMounted(() => {
  const editor = createConitEditor({
    // editor options
  })
  
  // Mount the editor to the container
  // editor.mount(editorContainer.value)
})
</script>

CSS Classes

The exported CSS includes the following main classes:

• .editor-container - Main editor container
• .toolbar - Toolbar container
• .toolbar-button - Toolbar buttons
• .editor-wrapper - Editor content wrapper
• .bn-editor - BlockNote editor styles

Development

# Install dependencies
pnpm install

# Build the package
npm run build

# Development mode
npm run dev

License

MIT