安装环境

官网：https://vueup.github.io/vue-quill/guide/modules.html

npm安装：npm install @vueup/vue-quill@latest --save
pnpm安装：pnpm add @vueup/vue-quill@latest

安装模块quill-blot-formatter
npm:npm install --save quill-blot-formatter
pnpm:npm add quill-blot-formatter

// 声明文本框能使用的工具
const toolbar = ref([
  'background',
  'bold',
  'color',
  'font',
  'code',
  'italic',
  'link',
  'size',
  'strike',
  'script',
  'underline',
  'blockquote',
  'header',
  'indent',
  'list',
  'align',
  'direction',
  'code-block',
  'image',
  'video'
])
// modules 属于 QuillEditor的配置项
const modules = {
  name: 'blotFormatter', // 名称
  module: BlotFormatter, // 模块
  options: toolbar //工具栏
}

组件：

<el-form-item label="文章内容" prop="content">
        <div class="editor">
          <QuillEditor
            :modules="modules"
            toolbar="full"
            v-model:content="formModel.content"
            contentType="html"
          />
        </div>
</el-form-item>

效果展示：