vue整合富文本编辑器tinymce

一、复制文本编辑器组件到项目文件夹里面
在这里插入图片描述
在这里插入图片描述
二、在build下的webpack.dev.conf.js里面添加

1
2
3
 templateParameters: {
        BASE_URL: config.dev.assetsPublicPath + config.dev.assetsSubDirectory
     }

在这里插入图片描述
三、在项目的index.html引入

1
2
  <script src=<%= BASE_URL %>/tinymce4.7.5/tinymce.min.js></script>
  <script src=<%= BASE_URL %>/tinymce4.7.5/langs/zh_CN.js></script>

四、在相关vue页面引入组件并声明组件

1
import Tinymce from '@/components/Tinymce'

在这里插入图片描述
五、在页面使用标签
在这里插入图片描述

注意:在三中<%= BASE_URL %>不要少加了%,否则无法使用