System.register(["./pinia-legacy.js","./vue-legacy.js"],(function(s){"use strict";var n;return{setters:[function(){},function(s){n=s.M}],execute:function(){s("default",n({components:{},template:'

# 下载安装

\n

同时更新维护 tinymce-plugin@npkg/tinymce-plugin 中。(二者同步)

\n

# CDN

\n
  • 1
<script src="https://unpkg.com/tinymce-plugin"></script>\n
html
\n

\n
  • 1
<script src="https://unpkg.com/@npkg/tinymce-plugin"></script>\n
html
\n

# NPM

\n\n \n
  • 1
npm i tinymce-plugin 或 npm i @npkg/tinymce-plugin \n
sh
\n
\n\n
  • 1
yarn add tinymce-plugin -D 或 yarn add @npkg/tinymce-plugin -D\n
sh
\n
\n
\n

\n

# 自行下载

\n

这些文件可以在 unpkg 或者jsDelivr 这些 CDN 上浏览和下载,自行存放

\n

# 使用

\n

# 引入

\n\n
  • 1
<script src="https://unpkg.com/@npkg/tinymce-plugin"></script>\n
html
\n\n
  • 1
import "tinymce-plugin";\n
js
\n

# 开启骨架屏(skeletonScreen)

\n

通过配置参数 skeletonScreen 来开启 tinymce 富文本框编辑器的骨架屏功能 ,改善 tinymce 富文本编辑器加载过长用户体验不佳

\n

提示

\n

要使用 skeletonScreen 必须 引入 tinymce-plugin@npkg/tinymce-plugin

\n
\n
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
import "tinymce-plugin"; \ntinymce.init({\n ...\n skeletonScreen: true,\n ...\n})\n
js
\n

使用效果\nskeletonScreen

\n

# 引入使用收录的插件或扩展

\n
  • 1
  • 2
  • 3
  • 4
import "tinymce-plugin"; //作为一些插件的必要依赖\nimport "tinymce-plugin/plugins/tpIndent2em";\nimport "tinymce-plugin/plugins/tpLayout";\nimport "tinymce-plugin/plugins/tpImportword";\n
js
\n

\n
  • 1
  • 2
  • 3
  • 4
import "@npkg/tinymce-plugin"; //作为一些插件的必要依赖\nimport "@npkg/tinymce-plugin/plugins/tpIndent2em";\nimport "@npkg/tinymce-plugin/plugins/tpLayout";\nimport "@npkg/tinymce-plugin/plugins/tpImportword";\n
js
\n
'}))}}}));