TOAST UI 编辑器安装与使用指南

TOAST UI 编辑器安装与使用指南

tui.editor项目地址:https://gitcode.com/gh_mirrors/tui/tui.editor

目录结构介绍

在TOAST UI编辑器中,其CDN目录的结构设计为了方便开发者理解和使用各个组件和资源。以下是其主要目录结构:

  • /uicdn.toast.com/
    • /editor/
      • /latest/
        • toastui-editor-all.js
        • toastui-editor-all.min.js
        • toastui-editor-viewer.js
        • toastui-editor-viewer.min.js
        • toastui-editor.css
        • toastui-editor.min.css
        • toastui-editor-viewer.css
        • toastui-editor-viewer.min.css
        • toastui-editor-only.css
        • toastui-editor-only.min.css
        • /theme/
          • toastui-editor-dark.css
          • toastui-editor-dark.min.css
      • /i18n/

启动文件介绍

主要JS文件

toastui-editor-all.js

这是TOAST UI编辑器的主要未压缩JavaScript文件,包含了所有的功能。

toastui-editor-all.min.js

这是一个经过压缩的版本,适用于生产环境以减少加载时间。

CSS样式文件

toastui-editor.css

此文件包含了用于TOAST UI编辑器的所有默认CSS样式。

toastui-editor.min.css

这是上文提到的CSS样式的压缩版,同样适合于生产环境中使用。

观看模式相关文件

对于仅查看或展示内容的功能,提供了以下文件:

toastui-editor-viewer.jstoastui-editor-viewer.min.js

这些文件是专门为只读或展示编辑后的文本而准备的。

toastui-editor-viewer.csstoastui-editor-viewer.min.css

提供相应的样式支持,使观看者界面更加美观。

配置选项介绍

当创建一个TOAST UI编辑器实例时,可以通过设置一系列可选参数来自定义编辑器的行为和外观。下面是一些关键配置项的例子:

  1. height: 这个属性允许你指定编辑区域的高度,可以是具体的像素值(如'300px')或者关键字auto来适应内容高度。

    height: '500px'
    
  2. initialEditType: 这个设置决定了初始显示模式是Markdown还是WYSIWYG(所见即所得)。可以选择'markdown''wysiwyg'作为初始值。

    initialEditType: 'markdown'
    
  3. previewStyle: 在Markdown模式下预览的方式选择,可以是水平分割或垂直布局,分别对应tabvertical

    previewStyle: 'vertical'
    
  4. usageStatistics: 设置是否发送统计信息给开发团队,以帮助他们改进产品,默认值为true表示允许收集统计信息。如果你不希望发送任何数据,可以将其设为false

    usageStatistics: false
    

以上选项只是众多可用配置中的几个例子,通过调整这些和其他设置,你可以让TOAST UI编辑器完全符合你的需求和偏好。


请注意,所有涉及到的路径中,“latest/”部分可以替换为你需要的具体版本号,以便从特定稳定版本获取所需的组件。这有助于确保项目的兼容性和稳定性。

tui.editor项目地址:https://gitcode.com/gh_mirrors/tui/tui.editor

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

富艾霏

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值