From 6c690c6a60348b77123e987af47a16674931f29c Mon Sep 17 00:00:00 2001 From: Catouse Date: Sat, 16 May 2015 10:35:33 +0800 Subject: [PATCH] * chang document index. --- docs/index.json | 35 ++++------ docs/part/start-edition.html | 127 ++++++++++++++++++++++++++++++++--- docs/part/start-grunt.html | 125 ---------------------------------- 3 files changed, 132 insertions(+), 155 deletions(-) delete mode 100755 docs/part/start-grunt.html diff --git a/docs/index.json b/docs/index.json index d10c809b..314b1b04 100644 --- a/docs/index.json +++ b/docs/index.json @@ -288,7 +288,7 @@ { "author": "Catouse", "id": "edition", - "name": "选择版本", + "name": "选择版本和定制", "icon": "icon-code-fork", "desc": "选择合适的版本", "topics": [ @@ -303,20 +303,11 @@ }, { "name": "组件清单" - }], - "filter": "xuanzebanben xzbb" - }, - { - "author": "Catouse", - "id": "grunt", - "name": "编译和定制", - "icon": "icon-terminal", - "desc": "定制你自己的版本", - "topics": [ + }, { - "name": "安装Grunt" + "name": "使用Grunt定制" }], - "filter": "bianyihedingzhi byhdz" + "filter": "xuanzebanben xzbb" }, { "author": "Catouse", @@ -460,15 +451,6 @@ }], "filter": "fuzhulei fzl" }, - { - "author": "Catouse", - "desc": "美化浏览器滚动条", - "icon": "icon-long-arrow-down", - "id": "scrollbar", - "name": "滚动条", - "topics": [], - "filter": "gundongtiao gdt" - }, { "author": "Catouse", "desc": "默认配色方案", @@ -650,6 +632,15 @@ "name": "类型" }], "filter": "fengexian fgx" + }, + { + "author": "Catouse", + "desc": "美化浏览器滚动条", + "icon": "icon-resize-v", + "id": "scrollbar", + "name": "滚动条", + "topics": [], + "filter": "gundongtiao gdt" }], "filter": "kongjian kj" }, diff --git a/docs/part/start-edition.html b/docs/part/start-edition.html index 991c32d1..a3653aa1 100755 --- a/docs/part/start-edition.html +++ b/docs/part/start-edition.html @@ -62,14 +62,6 @@ -
-

自定义版本

-
-

如果你需要更精确的控制预编译版本所包含的内容,强烈建议下载我们的源码来进行自定义配置并编译独一无二的版本。请参考章节编译及定制

-
-
-

组件清单

@@ -94,6 +86,125 @@
+
+

使用Grunt定制

+
+

ZUI使用 Grunt 作为构建系统。如果不了解 Grunt + 也没有关系,Grunt是一个非常棒而且容易上手的工具。下面给出简要步骤来准备编译ZUI,如果想了解更多请访问Grunt官方网站。

+

安装Grunt

+

Grunt构建在nodejs之上。在安装Grunt之前需要首先下载并安装node.js。最新版的nodejs已包含npm(node packaged modules)。npm是nodejs用来管理扩展包的工具。

+

安装nodejs之后,在命令行进行如下操作:

+
    +
  1. 在全局环境中安装grunt-clinpm install -g + grunt-cli
  2. +
  3. 进入ZUI源码目录,执行npm + install命令。nmp将读取包配置文件package.json文件并自动安装所有依赖的扩展包。
  4. +
+

使用 Grunt 来构建

+

完成上述步骤就可以进行编译了。只需要进入ZUI中使用命令行输入对应的命令就可以启动编译任务。内置的build命令可以完成大部分编译任务。以下为ZUI内置的一些常用任务命令。

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
命令说明输出目录
grunt build:standard编译标准版 +
    +
  • dist/js/zui*.js
  • +
  • dist/css/zui*.css
  • +
  • dist/fonts/**
  • +
+
grunt build:lite编译简洁版 +
    +
  • dist/js/zui.lite*.js
  • +
  • dist/css/zui.lite*.css
  • +
  • dist/fonts/**
  • +
+
grunt build:dist编译标准版和简洁版以及常用独立组件 +
    +
  • dist/js/**
  • +
  • dist/css/**
  • +
  • dist/fonts/**
  • +
  • dist/lib/*/**
  • +
+
grunt distgrunt build:dist的简单写法 +
    +
  • dist/js/**
  • +
  • dist/css/**
  • +
  • dist/fonts/**
  • +
  • dist/lib/*/**
  • +
+
grunt build:doc编译文档所需资源 +
    +
  • doc/js/zui*.js
  • +
  • doc/css/zui*.css
  • +
  • doc/fonts/**
  • +
+
grunt build:theme编译主题 +
    +
  • dist/css/zui-theme*.css
  • +
+
grunt build:[build name]编译独立组件包,[build + name]为组件包名称,可以为calendarkindeditorchosen +
    +
  • dist/lib/[build name]/**
  • +
+
grunt build:[control name]编译单独控件,[control + name]为控件名称,可以为buttonalertspanels +
    +
  • dist/lib/[control name]/**
  • +
+
+

如果了解Grunt,当然可以通过编辑Gruntfile.js文件来定义自己的编译任务。

+
+
+