vue项目使用tinymce

• 2020 年 2 月 17 日
• 筆記

最近又开始写小说了，但是感觉各种在线写作工具都不太好用，只有阅文的作者后台还算可以，但是必须要创建作品之后才能使用，有些尚处于构思或者内投的作品就不太方便放在阅文的作者后台进行写作了，于是准备使用阅文后台使用的Tinymce自己编写一个在现在写作工具来满足日常的写作需求，后续如果体验尚可，可以延展为独立产品或者开源产品。

安装TinyMCE

TinyMCE官方推荐使用cdn进行加载，但是需要先购买才行，不想购买则只能悬着手动加载TinyMCE。

这里使用 yarn ！

yarn add @tinymce/[email protected]  yarn add [email protected]

使用TinyMCE

创建一个 writer.vue 的组件

<template>      <editor :init="init" v-model="data"></editor>  </template>  <script>  import tinymce from 'tinymce/tinymce';  import 'tinymce/themes/silver/theme.min.js';  import 'tinymce/skins/ui/oxide/skin.min.css';  import Editor from '@tinymce/tinymce-vue';    export default {      data() {          return {              data: '',              init: {}          };      },      components: {          Editor      }  };  </script>

在页面中使用则直接加载组件，然后调用即可

汉化！