diff --git a/README.md b/README.md index 935eb93e..b07acb71 100644 --- a/README.md +++ b/README.md @@ -1,4 +1,8 @@ -

+

+ +

+ +

stars @@ -25,7 +29,7 @@ # 👀 前排提示 1. 本项目的目标是打造一个 “在线幻灯片应用” ,而非 “低代码平台”、“H5 编辑器” 或 “图片编辑工具” 等。 -2. 本项目的目标受众是有【Web 幻灯片】开发需求的开发者,提供的链接只是一个演示地址,并不能作为工具使用,也不提供任何在线服务。 +2. 本项目的目标受众是有【Web 幻灯片】开发需求的开发者,提供的链接只是一个演示地址,不提供任何在线服务。你不应该直接将本项目作为工具使用,也不支持一键部署。 如果你只是需要一个服务或工具,可以选择更优秀和成熟的产品,例如:[石墨文档](https://shimo.im/)、[金山文档](https://www.kdocs.cn/)、[Slidev](https://sli.dev/)、[revealjs](https://revealjs.com/) 等。 3. 本项目是基于 DOM 的渲染方案,好处是简单。但是相比 Canvas 渲染的方案,在复杂场景下性能会存在一定的差距,所以如果你对性能有较高的要求,本项目可能不是一个好的参考方向。 4. 这里总结了一些[常见问题](https://github.com/pipipi-pikachu/PPTist/blob/master/doc/Q&A.md),第一次提 Issues 和 PR 时,务必提前阅读此文档。 @@ -170,7 +174,8 @@ npm run serve # 💻 贡献代码 -首先感谢每一位关注本项目的朋友,非常欢迎每一位对本项目感兴趣的朋友贡献代码。 +首先感谢关注本项目的朋友,非常欢迎每一位对本项目感兴趣的朋友贡献代码。 + ### 具体参考如下: - fork 源码,下载到本地并运行项目 - 添加/修改代码 diff --git a/doc/Q&A.md b/doc/Q&A.md index 8ba29ba2..0ab484b2 100644 --- a/doc/Q&A.md +++ b/doc/Q&A.md @@ -1,59 +1,63 @@ ## 常见问题 -**Q. 为什么xxx快捷键没有作用?** +#### Q. 为什么xxx快捷键没有作用? A. 部分快捷键需要聚焦到指定区域才会生效,例如焦点在左边缩略图列表才能使用操作页面的快捷键,焦点在画布区域才能使用操作元素的快捷键。 -**Q. 为什么粘贴没有作用?** +#### Q. 为什么粘贴没有作用? A. 请注意允许浏览器访问系统剪贴板。 -**Q. 为什么浏览器刷新或重新打开后,之前做的PPT没有了?** +#### Q. 为什么浏览器刷新或重新打开后,之前做的PPT没有了? A. 该演示项目是纯前端部署的,不会保存数据。 -**Q. 如何调整幻灯片页面的顺序?** +#### Q. 如何调整幻灯片页面的顺序? A. 按住左侧缩略图可进行拖拽调整顺序。 -**Q. 为什么插入图片后会出现操作卡顿的情况?** +#### Q. 为什么插入图片后会出现操作卡顿的情况? A. 由于本演示项目不依赖后端,插入本地图片实际引用的是Base64,导致数据体积非常大,在真正的生产环境中应该上传图片后引用图片地址,就不会出现这样的情况了。 -**Q. 为什么应用预置主题后没有效果?** +#### Q. 为什么应用预置主题后没有效果? A. 设置预置主题的作用是使新添加的元素和页面应用主题样式,不会对已有的元素和页面生效,您可以使用“应用主题到全部”功能,将当前主题应用到全部页面中。 -**Q. 设置在线字体不生效?** +#### Q. 设置在线字体不生效? A. 设置在线字体时会下载对应的字体文件,该文件较大,需要等待下载完成后才会应用新的字体。 -**Q. 关于导入导出PPTX文件** +#### Q. 关于导入导出PPTX文件 A. 作为一个在线幻灯片应用,导出、导入 PPTX 文件是非常重要的功能,但是经过调研发现,该功能实现起来的复杂度远超过了预期。由于个人能力和时间有限,这部分功能只能借助第三方的轮子来完成。 -目前导出功能主要基于 [PptxGenJS](https://github.com/gitbrent/PptxGenJS/) 完成,能够实现大多数基本元素的导出,但还有非常多的缺陷需要一点点完善。同时需要知晓的是:1、该功能依赖 PptxGenJS,对于该库本身无法实现的部分(如动画),本项目也无能为力;2、导出功能的目标只是【导出样式尽可能一致的元素】,而不是一比一将网页还原到PPT,一些样式差异是必然存在的。 +导出:目前导出功能主要基于 [PptxGenJS](https://github.com/gitbrent/PptxGenJS/) 完成,能够实现大多数基本元素的导出,但还有非常多的缺陷需要一点点完善。同时需要知晓的是:1、该功能依赖 PptxGenJS,对于该库本身无法实现的部分(如动画),本项目也无能为力;2、导出功能的目标只是【导出样式尽可能一致的元素】,而不是一比一将网页还原到PPT,一些样式差异是必然存在的。 -导入功能目前暂时没有合适的解决方案,还在调研和观望中。如果有感兴趣或做过相关内容的朋友,欢迎来 issues 中讨论。 +导入:导入功能目前暂时没有合适的解决方案,还在调研和观望中。如果有感兴趣或做过相关内容的朋友,欢迎来 issues 中讨论。 -> PS. 我做了一个 [pptx转json](https://github.com/pipipi-pikachu/pptx2json) 的实验,可做参考。 +> PS. 我做了一个 [pptx转json](https://github.com/pipipi-pikachu/pptx2json) 的实验,如果你急需实现导入PPTX文件功能,可以此为参考自行实现。 -同时补充一点,本项目不是 office PPT 的专属在线编辑器,本质上与 office PPT 没有任何关系。【导入/导出 ppt 文件】只是项目的一个功能而非目的。 +同时补充一点,本项目不是 office PPT 的专属在线编辑器,本质上与 office PPT 没有任何关系。【导入/导出 ppt 文件】只是项目的一个[功能]而非[目的]。 -**Q. 视频元素支持哪些格式?** +#### Q. 视频元素支持哪些格式? A. 本项目只提供最基础的视频能力,正常状态下可以播放video标签本身支持的格式。 此外,可以额外引入 [hls.js](https://github.com/video-dev/hls.js) 或 [flv.js](https://github.com/Bilibili/flv.js) 来支持对应的格式(.m3u8 .flv),你只需要在项目中引入对应的文件(如cdn)即可,无需其他配置。 -**Q. 关于导入JSON文件** +#### Q. 关于导入JSON文件 A. 首先,出于安全等原因,个人并不建议将这种功能在前端直接暴露给用户,或者说用户根本就不应该接触到JSON这种格式(甚至导出JSON功能的初衷也只是为了方便开发)。如果真的有相关的需求,请自行在服务端实现,核心在于做好进行数据的校验,前端实现也是一样。 -**Q. 打印 / 导出 PDF 样式与实际有出入** +#### Q. 打印 / 导出 PDF 样式与实际有出入 A. 请注意在浏览器弹出的打印窗口调整相关的设置。建议:设置边距为【默认】、取消勾选【页眉和页脚】、勾选【背景图形】 -**Q. 为什么移动端不支持 xxx 功能?** +#### Q. 为什么移动端不支持 xxx 功能? -A. 首先需要明确的一点,就是移动端无论怎么做,体验上都是必然大不如 PC 端的。因此个人将移动端定位为:简单进行一些临时处理的应急使用。真正的设计/制作幻灯片应在电脑上使用完整的功能。如实在有移动端的特殊需求,可尝试在移动端使用电脑模式打开(当然,体验会更槽糕),或者开发者自己进行二次开发。 \ No newline at end of file +A. 首先需要明确的一点,就是移动端无论怎么做,体验上都是必然大不如 PC 端的。因此个人将移动端定位为:简单进行一些临时处理的应急使用。真正的设计/制作幻灯片应在电脑上使用完整的功能。如实在有移动端的特殊需求,可尝试在移动端使用电脑模式打开(当然,体验会更槽糕),或者开发者自己进行二次开发。 + +#### Q. 关于兼容性? + +A. 本项目优先兼容Chrome、Firefox。在Safari下可能存在部分兼容性问题。不兼容IE。 \ No newline at end of file diff --git a/public/index.html b/public/index.html index bc25fcad..66d96469 100644 --- a/public/index.html +++ b/public/index.html @@ -5,6 +5,8 @@ + + PPTIST - 在线演示文稿 diff --git a/src/views/Editor/EditorHeader/index.vue b/src/views/Editor/EditorHeader/index.vue index e23f127e..4d360aa6 100644 --- a/src/views/Editor/EditorHeader/index.vue +++ b/src/views/Editor/EditorHeader/index.vue @@ -44,7 +44,8 @@

@@ -115,9 +116,7 @@ const openSelectPanel = () => { const hotkeyDrawerVisible = ref(false) -const goIssues = () => { - window.open('https://github.com/pipipi-pikachu/PPTist/issues') -} +const goLink = (url: string) => window.open(url)