WebSlide-AllInOneNodeJs 網(wǎng)頁幻燈片制作工具
Web Slide - All In One 是一個(gè)用于生成網(wǎng)頁幻燈片的 Node 程序，由多個(gè)輸入文件（html、css、js、json），最終輸出為一個(gè) HTML 文件。
示例
右下角的按鈕可翻頁。
示例源文件可見demo/#input。
使用方法
- 在項(xiàng)目目錄下運(yùn)行
npm link。 - 在工作目錄下新建
#input文件夾，在這個(gè)文件夾中編寫幻燈片內(nèi)容（html、css、json）。 - 在工作目錄下運(yùn)行
web-slide。
運(yùn)行成功后在工作目錄下會(huì)生成#output 文件夾。
觀察模式：
sh web-slide --watch
輸入
所有輸入（配置、幻燈片、資源）放置在 #input 文件中，所有輸出產(chǎn)生在 #output 中。
配置
配置文件類型為 JSON，默認(rèn)名稱為 \$config.json 。
配置項(xiàng)可見：./src/config/runtime.js
全局腳本
全局腳本會(huì)在 DOMContentLoad 后執(zhí)行，默認(rèn)名稱為 \$config.js。
模塊可使用 CommonJs 和 ES 模塊方式引入。
全局樣式
全局樣式會(huì)應(yīng)用到所有幻燈片中，默認(rèn)名稱為 \$config.css 。 在\$config.css 中設(shè)置#Slide的屬性可以配置全局樣式。
內(nèi)置的 id 和 class 使用大坨峰和連字符命名，自定義的 id 和 class 建議使用小拓峰和連字符命名。
幻燈片
幻燈片以 HTML 文件組織，一個(gè) HTML 文件代表一張幻燈片。
幻燈片以 HTML 的名稱排序。
模板
html <body></body> <style></style> <script></script>
body、style、script 的內(nèi)容會(huì)被提取并添加到頁面中。
API
Broadcast（廣播，詳見：./src/web/core/broadcast/index.js），會(huì)觸發(fā)事件：
- render：渲染
樣式
詳見./src/web/style。