[release] 4.1.9

CHANGELOG.md

@@ -1,5 +1,17 @@
 # Changelog
 
+4.1.9 / 2017-05-31
+
+  * fix(lifecycle): continue to handle data
+  * fix: can't render toc on first load, fixed #171
+  * fix(render): broken name link, fixed #167
+
+## 4.1.8(since 4.1.1) / 2017-05-31
+
+  * fix(pure-css):add coverpage style, fixed #165
+  * feat: add edit button demo, close #162
+  * fix some ssr bugs
+
 ## 4.1.0 / 2017-05-30 🎂 to me
 
 

build/build-cover.js

@@ -0,0 +1,11 @@
+var fs = require('fs')
+var read = fs.readFileSync
+var write = fs.writeFileSync
+var version = process.env.VERSION || require('../package.json').version
+
+var file = __dirname + '/../docs/_coverpage.md'
+var cover = read(file, 'utf8').toString()
+
+console.log('Replace version number in cover page...')
+cover = cover.replace(/<small>(\S+)?<\/small>/g, '<small>' + version + '</small>')
+write(file, cover)

build/build-ssr.js

@@ -1,13 +1,16 @@
 var rollup = require('rollup')
 var buble = require('rollup-plugin-buble')
 var async = require('rollup-plugin-async')
-var isProd = process.argv[process.argv.length - 1] !== '--dev'
+var replace = require('rollup-plugin-replace')
 
 rollup
   .rollup({
     entry: 'packages/docsify-server-renderer/index.js',
     plugins: [
       async(),
+      replace({
+        __VERSION__: process.env.VERSION || require('../package.json').version
+      }),
       buble({
         transforms: {
           generator: false

build/build.js

@@ -4,7 +4,9 @@ var commonjs = require('rollup-plugin-commonjs')
 var nodeResolve = require('rollup-plugin-node-resolve')
 var string = require('rollup-plugin-string')
 var uglify = require('rollup-plugin-uglify')
+var replace = require('rollup-plugin-replace')
 var isProd = process.argv[process.argv.length - 1] !== '--dev'
+var version = process.env.VERSION || require('../package.json').version
 
 var build = function (opts) {
   rollup
@@ -14,7 +16,10 @@ var build = function (opts) {
         string({ include: '**/*.css' }),
         buble(),
         commonjs(),
-        nodeResolve()
+        nodeResolve(),
+        replace({
+          __VERSION__: version
+        })
       ])
     })
     .then(function (bundle) {

dev.html

@@ -28,15 +28,23 @@
     executeScript: true,
     loadNavbar: true,
     loadSidebar: true,
+    coverpage: true,
     name: 'docsify',
     subMaxLevel: 2,
     mergeNavbar: true,
     formatUpdated: '{MM}/{DD} {HH}:{mm}',
     routerMode: 'history',
     plugins: [
-      function(hook) {
+      function(hook, vm) {
         hook.beforeEach(function (html) {
-          return html += '\n> Last modified {docsify-updated}'
+          var url = 'https://github.com/QingWei-Li/docsify/blob/master' + vm.router.getFile()
+          var editHtml = '[:memo: Edit Document](' + url + ')\n'
+
+          return editHtml
+            + html
+            + '\n----\n'
+            + 'Last modified {docsify-updated} '
+            + editHtml
         })
       }
     ]

docs/README.md

@@ -17,6 +17,7 @@ See the [Quick start](quickstart.md) for more details.
 * Useful plugin API
 * Emoji support
 * Compatible with IE10+
+- Support SSR ([example](https://github.com/QingWei-Li/docsify-ssr-demo))
 
 ## Examples
 

docs/_coverpage.md

@@ -1,6 +1,6 @@
 ![logo](_media/icon.svg)
 
-# docsify <small>4.0</small>
+# docsify <small>4.1.9</small>
 
 > A magical documentation site generator.
 

docs/de-de/README.md

@@ -17,6 +17,7 @@ Siehe [Schnellstart](de-de/quickstart.md) für weitere Informationen.
 * praktische API für Erweiterungen
 * Unterstützung für Emoji
 * Kompatibel mit IE10+
+- Support SSR ([example](https://github.com/QingWei-Li/docsify-ssr-demo))
 
 ## Beispiele
 

docs/de-de/ssr.md

@@ -2,6 +2,8 @@
 
 See https://docsify.now.sh
 
+Repo in https://github.com/QingWei-Li/docsify-ssr-demo
+
 ## Why SSR?
 - Better SEO
 - Feeling cool
@@ -11,24 +13,24 @@ See https://docsify.now.sh
 Install `now` and `docsify-cli` in your project.
 
 ```bash
-npm i now -g
-npm i docsify-cli -D
+npm i now docsify-cli -D
 ```
 
- Edit `package.json`. If the documentation in `./docs` subdirectory.
+Edit `package.json`. If the documentation in `./docs` subdirectory.
 
 ```json
 {
   "name": "my-project",
   "scripts": {
-    "start": "docsify start ."
+    "start": "docsify start . -c ssr.config.js",
+    "deploy": "now -p"
   },
   "files": [
     "docs"
   ],
   "docsify": {
     "config": {
-      "basePath": "/docs/",
+      "basePath": 'https://docsify.js.org/',
       "loadSidebar": true,
       "loadNavbar": true,
       "coverpage": true,
@@ -38,10 +40,7 @@ npm i docsify-cli -D
 }
 ```
 
- Remove `index.html`
-
-
-!> The `basePath` just like webpack `publicPath`. You should config it if your docs is in the subdirectory.
+!> The `basePath` just like webpack `publicPath`. We can use local or remote files.
 
 We can preview in the local to see if it works.
 

docs/de-de/write-a-plugin.md

@@ -47,6 +47,8 @@ window.$docsify = {
 
 ## Beispiel
 
+### footer
+
 Füge jeder Seite eine footer Komponente hinzu:
 
 ```js
@@ -68,3 +70,25 @@ window.$docsify = {
   ]
 }
 ```
+
+
+### Edit Button
+
+```js
+window.$docsify = {
+  plugins: [
+    function(hook, vm) {
+      hook.beforeEach(function (html) {
+        var url = 'https://github.com/QingWei-Li/docsify/blob/master/docs' + vm.route.file
+        var editHtml = '[📝 EDIT DOCUMENT](' + url + ')\n'
+
+        return editHtml
+          + html
+          + '\n----\n'
+          + 'Last modified {docsify-updated} '
+          + editHtml
+      })
+    }
+  ]
+}
+```

docs/index.html

@@ -51,9 +51,16 @@
     },
     formatUpdated: '{MM}/{DD} {HH}:{mm}',
     plugins: [
-      function(hook) {
+      function(hook, vm) {
         hook.beforeEach(function (html) {
-          return html += '\n> Last modified {docsify-updated}'
+          var url = 'https://github.com/QingWei-Li/docsify/blob/master/docs' + vm.route.file
+          var editHtml = '[:memo: Edit Document](' + url + ')\n'
+
+          return editHtml
+            + html
+            + '\n----\n'
+            + 'Last modified {docsify-updated} '
+            + editHtml
         })
       }
     ]

docs/ssr.md

@@ -2,6 +2,8 @@
 
 See https://docsify.now.sh
 
+Repo in https://github.com/QingWei-Li/docsify-ssr-demo
+
 ## Why SSR?
 - Better SEO
 - Feeling cool
@@ -11,8 +13,7 @@ See https://docsify.now.sh
 Install `now` and `docsify-cli` in your project.
 
 ```bash
-npm i now -g
-npm i docsify-cli -D
+npm i now docsify-cli -D
 ```
 
 Edit `package.json`. If the documentation in `./docs` subdirectory.
@@ -21,14 +22,15 @@ Edit `package.json`. If the documentation in `./docs` subdirectory.
 {
   "name": "my-project",
   "scripts": {
-    "start": "docsify start ."
+    "start": "docsify start . -c ssr.config.js",
+    "deploy": "now -p"
   },
   "files": [
     "docs"
   ],
   "docsify": {
     "config": {
-      "basePath": "/docs/",
+      "basePath": 'https://docsify.js.org/',
       "loadSidebar": true,
       "loadNavbar": true,
       "coverpage": true,
@@ -38,9 +40,7 @@ Edit `package.json`. If the documentation in `./docs` subdirectory.
 }
 ```
 
-Remove `index.html`
-
-!> The `basePath` just like webpack `publicPath`. You should config it if your docs is in the subdirectory.
+!> The `basePath` just like webpack `publicPath`. We can use local or remote files.
 
 We can preview in the local to see if it works.
 

docs/write-a-plugin.md

@@ -47,6 +47,8 @@ window.$docsify = {
 
 ## Example
 
+#### footer
+
 Add footer component in each pages.
 
 ```js
@@ -68,3 +70,24 @@ window.$docsify = {
   ]
 }
 ```
+
+### Edit Button
+
+```js
+window.$docsify = {
+  plugins: [
+    function(hook, vm) {
+      hook.beforeEach(function (html) {
+        var url = 'https://github.com/QingWei-Li/docsify/blob/master/docs' + vm.route.file
+        var editHtml = '[📝 EDIT DOCUMENT](' + url + ')\n'
+
+        return editHtml
+          + html
+          + '\n----\n'
+          + 'Last modified {docsify-updated} '
+          + editHtml
+      })
+    }
+  ]
+}
+```

docs/zh-cn/README.md

@@ -18,6 +18,7 @@ docsify 是一个动态生成文档网站的工具。不同于 GitBook、Hexo
 - 丰富的 API
 - 支持 Emoji
 - 兼容 IE10+
+- 支持 SSR ([example](https://github.com/QingWei-Li/docsify-ssr-demo))
 
 ## 例子
 

docs/zh-cn/ssr.md

@@ -1,67 +1,61 @@
-# Server client renderer
+# 服务端渲染（SSR）
 
-See https://docsify.now.sh
+先看例子 https://docsify.now.sh
 
-## Why SSR?
-- Better SEO
-- Feeling cool
+项目地址在 https://github.com/QingWei-Li/docsify-ssr-demo
 
-## Quick start
+![](https://dn-mhke0kuv.qbox.me/2bfef08c592706108055.png)
 
-Install `now` and `docsify-cli` in your project.
+文档依旧是部署在 GitHub Pages 上，Node 服务部署在 now.sh 里，渲染的内容是从 GitHub Pages 上同步过来的。所以静态部署文档的服务器和服务端渲染的 Node 服务器是分开的，也就是说你还是可以用之前的方式更新文档，并不需要每次都部署。
+
+
+
+## 快速开始
+
+如果你熟悉 `now` 的使用，接下来的介绍就很简单了。先创建一个新项目，并安装 `now` 和 `docsify-cli`。
 
 ```bash
-npm i now -g
-npm i docsify-cli -D
+mkdir my-ssr-demo && cd my-ssr-demo
+npm init -y
+npm i now docsify-cli -D
 ```
 
-2. Edit `package.json`. If the documentation in `./docs` subdirectory.
+配置 `package.json`
 
 ```json
 {
-  "name": "my-project",
   "scripts": {
-    "start": "docsify start ."
+    "start": "docsify start .",
+    "deploy": "now -p"
   },
-  "files": [
-    "docs"
-  ],
   "docsify": {
     "config": {
-      "basePath": "/docs/",
+      "basePath": "https://docsify.js.org/",
       "loadSidebar": true,
-      "loadNavbar": true,
-      "coverpage": true,
-      "name": "docsify"
+      "loadNavbar": true
     }
   }
 }
 ```
 
+如果你还没有创建文档，可以参考[之前的文章](https://zhuanlan.zhihu.com/p/24540753)。其中 `basePath` 为文档所在的路径，可以填你的 docsify 文档网站。
 
-Remove `index.html`
+配置可以单独写在配置文件内，然后通过 `--config config.js` 加载。
 
-!> The `basePath` just like webpack `publicPath`. You should config it if your docs is in the subdirectory.
+渲染的基础模版也可以自定义，配置在 `template` 属性上，例如
 
-We can preview in the local to see if it works.
-
-```bash
-npm start
-
-# open http://localhost:4000
+```js
+"docsify": {
+    "template": "./ssr.html",
+    "config": {
+      "basePath": "https://docsify.js.org/",
+      "loadSidebar": true,
+      "loadNavbar": true
+    }
+  }
 ```
 
-Publish it!
-
-```bash
-now -p
-```
-
-Now, You have a support for SSR the docs site.
-
-## Custom template
-
-You can provide a templte for entire page's HTML. such as
+*ssr.html*
 
 ```html
 <!DOCTYPE html>
@@ -69,41 +63,39 @@ You can provide a templte for entire page's HTML. such as
 <head>
   <meta charset="UTF-8">
   <title>docsify</title>
+  <link rel="icon" href="_media/favicon.ico">
+  <meta name="keywords" content="doc,docs,documentation,gitbook,creator,generator,github,jekyll,github-pages">
+  <meta name="description" content="A magical documentation generator.">
   <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
-  <link rel="stylesheet" href="//unpkg.com/docsify/themes/vue.css" title="vue">
+  <link rel="stylesheet" href="//unpkg.com/docsify/lib/themes/vue.css" title="vue">
 </head>
 <body>
   <!--inject-app-->
   <!--inject-config-->
 </body>
-<script src="//unpkg.com/docsify/lib/docsify.js"></script>
-<script src="//unpkg.com/docsify/lib/plugins/search.js"></script>
-<script src="//unpkg.com/prismjs/components/prism-bash.min.js"></script>
-<script src="//unpkg.com/prismjs/components/prism-markdown.min.js"></script>
-<script src="//unpkg.com/prismjs/components/prism-nginx.min.js"></script>
+<script src="//unpkg.com/docsify/lib/docsify.min.js"></script>
+<script src="//unpkg.com/docsify/lib/plugins/search.min.js"></script>
 </html>
+
 ```
 
-The template should contain these comments for rendered app content.
- - `<!--inject-app-->`
- - `<!--inject-config-->`
+其中 `<!--inject-app-->` 和 `<!--inject-config-->` 为占位符，会自动将渲染后的 html 和配置内容注入到页面上。
 
-## Configuration
+现在，你可以运行 `npm start` 预览效果，如果没有问题就通过 `npm run deploy` 部署服务。
 
-You can configure it in a special config file, or `package.json`.
+```bash
+npm start
+# open http://localhost:4000
 
-```js
-module.exports = {
-  template: './ssr.html',
-  config: {
-   // docsify config
-  }
-}
+npm run deploy
+# now ...
 ```
 
-## Deploy for your VPS
 
-You can run `docsify start` directly on your Node server, or write your own server app with `docsify-server-renderer`.
+
+## 更多玩法
+
+`docsify start` 其实是依赖了 [`docsify-server-renderer`](https://npmarket.surge.sh/?name=docsify-server-renderer) 模块，如果你感兴趣，你完全可以用它自己实现一个 server，可以加入缓存等功能。
 
 ```js
 var Renderer = require('docsify-server-renderer')
@@ -122,3 +114,5 @@ renderer.renderToString(url)
   .then(html => {})
   .catch(err => {})
 ```
+
+当然文档文件和 server 也是可以部署在一起的，`basePath` 不是一个 URL 的话就会当做文件路径处理，也就是从服务器上加载资源。

docs/zh-cn/write-a-plugin.md

@@ -46,6 +46,9 @@ window.$docsify = {
 
 ## 例子
 
+
+### footer
+
 给每个页面的末尾加上 `footer`
 
 ```js
@@ -66,4 +69,26 @@ window.$docsify = {
     }
   ]
 }
+```
+
+
+### Edit Button
+
+```js
+window.$docsify = {
+  plugins: [
+    function(hook, vm) {
+      hook.beforeEach(function (html) {
+        var url = 'https://github.com/QingWei-Li/docsify/blob/master/docs' + vm.route.file
+        var editHtml = '[📝 EDIT DOCUMENT](' + url + ')\n'
+
+        return editHtml
+          + html
+          + '\n----\n'
+          + 'Last modified {docsify-updated} '
+          + editHtml
+      })
+    }
+  ]
+}
 ```

lerna.json

@@ -0,0 +1,7 @@
+{
+  "lerna": "2.0.0-rc.5",
+  "packages": [
+    "packages/*"
+  ],
+  "version": "0.0.0"
+}

lib/docsify.js

@@ -126,23 +126,22 @@ function initLifecycle (vm) {
 function callHook (vm, hook, data, next) {
   if ( next === void 0 ) next = noop;
 
-  var newData = data;
   var queue = vm._hooks[hook];
 
   var step = function (index) {
     var hook = queue[index];
     if (index >= queue.length) {
-      next(newData);
+      next(data);
     } else {
       if (typeof hook === 'function') {
         if (hook.length === 2) {
           hook(data, function (result) {
-            newData = result;
+            data = result;
             step(index + 1);
           });
         } else {
           var result = hook(data);
-          newData = result !== undefined ? result : newData;
+          data = result !== undefined ? result : data;
           step(index + 1);
         }
       } else {
@@ -2797,8 +2796,8 @@ Compiler.prototype._initRenderer = function _initRenderer () {
   var ref = this;
     var linkTarget = ref.linkTarget;
     var router = ref.router;
-    var toc = ref.toc;
     var contentBase = ref.contentBase;
+  var _self = this;
   /**
    * render anchor tag
    * @link https://github.com/chjj/marked#overriding-renderer-methods
@@ -2821,7 +2820,7 @@ Compiler.prototype._initRenderer = function _initRenderer () {
     var slug = slugify(text);
     var url = router.toURL(router.getCurrentPath(), { id: slug });
     nextToc.slug = url;
-    toc.push(nextToc);
+    _self.toc.push(nextToc);
 
     return ("<h" + level + " id=\"" + slug + "\"><a href=\"" + url + "\" data-id=\"" + slug + "\" class=\"anchor\"><span>" + text + "</span></a></h" + level + ">")
   };
@@ -3288,6 +3287,7 @@ function initRender (vm) {
     // Polyfll
     cssVars(config.themeColor);
   }
+  vm._updateRender();
   toggleClass(body, 'ready');
 }
 
@@ -3544,7 +3544,6 @@ function initRouter (vm) {
 
   router.normalize();
   lastRoute = vm.route = router.parse();
-  vm._updateRender();
 
   router.onchange(function (_) {
     router.normalize();
@@ -3741,6 +3740,11 @@ eventMixin(proto);
  */
 initGlobalAPI();
 
+/**
+ * Version
+ */
+Docsify.version = '4.1.8';
+
 /**
  * Run Docsify
  */

lib/plugins/front-matter.js

@@ -498,6 +498,6 @@ var install = function (hook, vm) {
   });
 };
 
-window.$docsify.plugins = [].concat(install, window.$docsify.plugins);
+$docsify.plugins = [].concat(install, $docsify.plugins);
 
 }());

package.json

@@ -1,6 +1,6 @@
 {
   "name": "docsify",
-  "version": "4.1.7",
+  "version": "4.1.9",
   "description": "A magical documentation generator.",
   "author": {
     "name": "qingwei-li",
@@ -20,7 +20,8 @@
     "themes"
   ],
   "scripts": {
-    "build": "rm -rf lib themes && node build/build && mkdir lib/themes && mkdir themes && node build/build-css && npm run build:ssr",
+    "bootstrap": "npm i && lerna bootstrap",
+    "build": "rm -rf lib themes && node build/build && mkdir lib/themes && mkdir themes && node build/build-css && npm run build:ssr && node build/build-cover",
     "dev:build": "rm -rf lib themes && mkdir themes && node build/build --dev && node build/build-css --dev",
     "dev": "node app & nodemon -w src -e js,css --exec 'npm run dev:build'",
     "build:ssr": "node build/build-ssr",
@@ -39,6 +40,7 @@
     "eslint": "^3.18.0",
     "eslint-config-vue": "^2.0.2",
     "eslint-plugin-vue": "^2.0.1",
+    "lerna": "^2.0.0-rc.5",
     "nodemon": "^1.11.0",
     "postcss": "^5.2.16",
     "postcss-salad": "^1.0.8",
@@ -47,6 +49,7 @@
     "rollup-plugin-buble": "^0.15.0",
     "rollup-plugin-commonjs": "^8.0.2",
     "rollup-plugin-node-resolve": "^2.0.0",
+    "rollup-plugin-replace": "^1.1.1",
     "rollup-plugin-string": "^2.0.2",
     "rollup-plugin-uglify": "^1.0.1",
     "serve-static": "^1.12.1"

packages/docsify-server-renderer/index.js

@@ -139,3 +139,5 @@ export default class Renderer {
     }
   }
 }
+
+Renderer.version = '__VERSION__'

packages/docsify-server-renderer/package.json

@@ -1,6 +1,6 @@
 {
   "name": "docsify-server-renderer",
-  "version": "4.1.7",
+  "version": "4.1.8",
   "description": "docsify server renderer",
   "author": {
     "name": "qingwei-li",

src/core/index.js

@@ -22,6 +22,11 @@ eventMixin(proto)
  */
 initGlobalAPI()
 
+/**
+ * Version
+ */
+Docsify.version = '__VERSION__'
+
 /**
  * Run Docsify
  */

src/core/init/lifecycle.js

@@ -19,23 +19,22 @@ export function initLifecycle (vm) {
 }
 
 export function callHook (vm, hook, data, next = noop) {
-  let newData = data
   const queue = vm._hooks[hook]
 
   const step = function (index) {
     const hook = queue[index]
     if (index >= queue.length) {
-      next(newData)
+      next(data)
     } else {
       if (typeof hook === 'function') {
         if (hook.length === 2) {
           hook(data, result => {
-            newData = result
+            data = result
             step(index + 1)
           })
         } else {
           const result = hook(data)
-          newData = result !== undefined ? result : newData
+          data = result !== undefined ? result : data
           step(index + 1)
         }
       } else {

src/core/render/compiler.js

@@ -44,7 +44,8 @@ export class Compiler {
 
   _initRenderer () {
     const renderer = new marked.Renderer()
-    const { linkTarget, router, toc, contentBase } = this
+    const { linkTarget, router, contentBase } = this
+    const _self = this
     /**
      * render anchor tag
      * @link https://github.com/chjj/marked#overriding-renderer-methods
@@ -67,7 +68,7 @@ export class Compiler {
       const slug = slugify(text)
       const url = router.toURL(router.getCurrentPath(), { id: slug })
       nextToc.slug = url
-      toc.push(nextToc)
+      _self.toc.push(nextToc)
 
       return `<h${level} id="${slug}"><a href="${url}" data-id="${slug}" class="anchor"><span>${text}</span></a></h${level}>`
     }

src/core/render/index.js

@@ -208,5 +208,6 @@ export function initRender (vm) {
     // Polyfll
     cssVars(config.themeColor)
   }
+  vm._updateRender()
   dom.toggleClass(dom.body, 'ready')
 }

src/core/router/index.js

@@ -23,7 +23,6 @@ export function initRouter (vm) {
 
   router.normalize()
   lastRoute = vm.route = router.parse()
-  vm._updateRender()
 
   router.onchange(_ => {
     router.normalize()

src/plugins/front-matter/index.js

@@ -10,4 +10,4 @@ const install = function (hook, vm) {
   })
 }
 
-window.$docsify.plugins = [].concat(install, window.$docsify.plugins)
+$docsify.plugins = [].concat(install, $docsify.plugins)

src/themes/pure.css

@@ -3,3 +3,4 @@ $color-bg: #fff;
 $color-text: #000;
 $sidebar-width: 300px;
 @import "basic/layout";
+@import "basic/coverpage";