vue中使用Tinymce编辑器

  1. 首先安装所需的两个包
npm install tinymce -S npm --save @tinymce/tinymce-vue
  1. 查看vue-cli脚手架版本号,根据vue-cli版本号进行以下操作
vue -V
npm list --depth=0 -g
  1. 复制内容和样式包
    ① 在 node_modules 文件夹中找到 tinymce/skins 文件,进行复制;如果vue-cli的版本号为2就将其内容复制到static文件夹中,若版本号为3就将其内容复制到public文件夹中,在下是版本为2的如图所示


    vue中使用Tinymce编辑器_第1张图片
    node_modules文件中的skins

    vue中使用Tinymce编辑器_第2张图片
    static文件夹结构

② 下载 zh_CN.js中文包,复制到 tinymce文件中 点击下载

  1. 代码内容


  1. 页面样式


    vue中使用Tinymce编辑器_第3张图片
    效果图

你可能感兴趣的:(vue中使用Tinymce编辑器)