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 目录下, 一个文件夹代表一个主题), 每个主题模板的目录结构如下:

1. /static
2. /templates
3. Makefile
4. README.md
5. 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行为:

1. <meta name="generator" content="{{system.name}} {{system.version}}" />
2. <meta http-equiv="X-UA-Compatible" content="IE=edge">
3. <script src="{{static_url('js/seajs/seajs/2.1.1/sea.js')}}"></script> <!--修改这行, 这个就指向了static/js目录里的seajs, 就不用上网调取seajs了,对jquery也是一样的操作-->
4. {%- block assets %}

然后layout.html 和 snippet/head.html 都可以稍作修改, 具体怎么改, 根据你自己的喜好来吧.反正改了之后, 刷新网页就能看到变化.

别的不多说了. 请看下回.

更多开发学习资料请访问www.javarecord.com