spm使用之五修改spm自帶文檔主題模闆

spm自帶的文檔的主題模闆, 其檔案在C:\Documents and Settings\Administrator\.spm\themes 目錄下, 有個叫做cmd 檔案夾的.

其實 cmd這個檔案夾, 他的檔案在github上有, https://github.com/spmjs/nico-cmd 就是nico-cmd, 從這裡可以看出, spm doc 工具其實和nico有很深的淵源.

nico-cmd 下載下傳後, 解壓, 将nico-cmd 放在 C:\Documents and Settings\Administrator\.spm\themes 目錄下, 然後将nico-cmd改名為cmd, 這一步一般情況下不需要你做, 因為你安裝spm doc的時候, 就自動下載下傳并安裝好了(網絡不好裝不上的話不要來擡杠), nico-cmd現在歸spmjs維護了, 以前它叫 https://github.com/aralejs/nico-arale , 對, 叫nico-arale

那麼是不是隻有這一個文檔主題模闆呢, 肯定不是的, 因為nico最開始是為arale 這個前端CSS和js架構服務的, 專門解析md格式的markdown文檔, 在本地伺服器上展現靜态html檔案的. 當然nico的用途還不僅僅解析文檔, 還可以建立自己的靜态部落格網站.

這裡有一個叫做nico-one的文檔模闆: https://github.com/lepture/nico-one 把他可以下載下傳了, 放到  C:\Documents and Settings\Administrator\.spm\themes 

這個nico-one下載下傳了之後, 怎麼在spm doc watch之後可以看到, 以後再說.

從上面可以看出, 光是用一個seajs,你就得接觸 spmjs來管理自己建立的seajs子產品, 什麼sea-modules(仿node的node_modules), 然後你想一邊編寫自己的seajs子產品的文檔, 一邊調試自己寫的子產品, spm doc這個好工具就上場了, 然後你想你的文檔的展示頁面跟别人的不一樣, 這個時候, 你就需要修改spm doc自帶的文檔主題模闆了(上面說了, 位于C:\Documents and Settings\Administrator\.spm\themes 目錄下, 一個檔案夾代表一個主題), 每個主題模闆的目錄結構如下:

/static	
/templates	
Makefile
README.md
theme.js
           

static目錄下有css和js, 就是你的文檔主題模闆中公用的東西, 這個static檔案夾, 在你自己編寫的seajs子產品的目錄裡使用spm doc watch 指令後, 會被複制到_site檔案夾裡.

templates目錄裡是一些html的模闆檔案, 這個由nico負責将md文檔檔案解析後, 填入html模闆的相應位置, 最後展現到前端.

好了, 下面開始說修改這些主題模闆的問題了. 從自帶的cmd開始吧.

以前說道, 網連不上的時候, seajs沒法用了, 因為seajs是調取阿裡的cdn.  你可能要說, 網連不上了, 我就放假了,我就不弄這個了. 

其實 上回下載下傳的examples-master目錄裡, 有個sea-modules檔案夾, 裡面有seajs的檔案, 是以, 網連不上了, 可以把這裡的seajs檔案複制到C:\Documents and Settings\Administrator\.spm\themes\cmd\static\js目錄裡. 就可以用了

然後修改 C:\Documents and Settings\Administrator\.spm\themes\cmd\templates\layout.html 第9行為:

<meta name="generator" content="{{system.name}} {{system.version}}" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <script src="{{static_url('js/seajs/seajs/2.1.1/sea.js')}}"></script> <!--修改這行, 這個就指向了static/js目錄裡的seajs, 就不用上網調取seajs了,對jquery也是一樣的操作-->
    {%- block assets %}
           

然後layout.html 和 snippet/head.html 都可以稍作修改, 具體怎麼改, 根據你自己的喜好來吧.反正改了之後, 重新整理網頁就能看到變化.

别的不多說了. 請看下回.