[release] 4.1.1

[build] 4.1.1
fix: build for ssr package
2026-08-09 21:36:10 +10:00 · 2017-05-30 13:15:13 +08:00 · 2017-05-30 13:15:13 +08:00 · 2017-05-30 13:13:41 +08:00 · 2017-05-30 12:55:09 +08:00 · 2017-05-30 12:52:52 +08:00
17 changed files with 420 additions and 25 deletions
@@ -1,5 +1,12 @@
 # Changelog

+## 4.1.0 / 2017-05-30 🎂 for me
+
+
+  * feat: Support server client renderer [See detail](//docsify.js.org/#/ssr)
+  * feat: Support HTML5 history API. `$docsify.routerMode = 'history'`
+  * Breaking change: Clean global API
+
 ## 3.7.3 / 2017-05-22

  * fix(render): find => filter, Compatible with old browser
@@ -1,12 +1,21 @@
 var rollup = require('rollup')
-var async = require('rollup-plugin-async')
+var babel = require('rollup-plugin-babel')
 var isProd = process.argv[process.argv.length - 1] !== '--dev'

 rollup
  .rollup({
    entry: 'packages/docsify-server-renderer/index.js',
    plugins: [
-      async()
+      babel({
+        presets: [
+          [
+            'es2015',
+            {
+              modules: false
+            }
+          ]
+        ]
+      })
    ],
    onwarn: function() {}
  })
@@ -18,5 +18,6 @@
  - [Vue compatibility](vue.md)
  - [CDN](cdn.md)
  - [Offline Mode(PWA)](pwa.md)
+  - [Server-client renderer(SSR)](ssr.md)

 - [Changelog](changelog.md)
@@ -317,7 +317,7 @@ window.$docsify = {
 ```

 ## format-updated
-We can display the file update date through **{docsify-updated<span>}</span>** variable. And format it by `formatUpdated`. 
+We can display the file update date through **{docsify-updated<span>}</span>** variable. And format it by `formatUpdated`.
 See https://github.com/lukeed/tinydate#patterns
 ```js
 window.$docsify = {
@@ -340,3 +340,10 @@ window.$docsify = {
  externalLinkTarget: '_self' // default: '_blank'
 }
 ```
+
+## router-mode
+```js
+window.$docsify = {
+  routerMode: 'history' // default: 'hash'
+}
+```
@@ -18,5 +18,6 @@
  - [Vue Kompatibilität](de-de/vue.md)
  - [CDN](de-de/cdn.md)
  - [Offline Modus (PWA)](de-de/pwa.md)
+  - [Server-client renderer (SSR)](de-de/ssr.md)

 - [Changelog](de-de/changelog.md)
@@ -0,0 +1,124 @@
+# Server client renderer
+
+See https://docsify.now.sh
+
+## Why SSR?
+- Better SEO
+- Feeling cool
+
+## Quick start
+
+Install `now` and `docsify-cli` in your project.
+
+```bash
+npm i now -g
+npm i docsify-cli -D
+```
+
+ Edit `package.json`. If the documentation in `./docs` subdirectory.
+
+```json
+{
+  "name": "my-project",
+  "scripts": {
+    "start": "docsify start ."
+  },
+  "files": [
+    "docs"
+  ],
+  "docsify": {
+    "config": {
+      "basePath": "/docs/",
+      "loadSidebar": true,
+      "loadNavbar": true,
+      "coverpage": true,
+      "name": "docsify"
+    }
+  }
+}
+```
+
+ Remove `index.html`
+
+
+!> The `basePath` just like webpack `publicPath`. You should config it if your docs is in the subdirectory.
+
+We can preview in the local to see if it works.
+
+```bash
+npm start
+
+# open http://localhost:4000
+```
+
+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
+
+```html
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <title>docsify</title>
+  <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">
+</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>
+</html>
+```
+
+The template should contain these comments for rendered app content.
+ - `<!--inject-app-->`
+ - `<!--inject-config-->`
+
+## Configuration
+
+You can configure it in a special config file, or `package.json`.
+
+```js
+module.exports = {
+  tempate: './ssr.html',
+  config: {
+   // docsify config
+  }
+}
+```
+
+## Deploy for your VPS
+
+You can run `docsify start` directly on your Node server, or write your own server app with `docsify-server-renderer`.
+
+```js
+var Renderer = require('docsify-server-renderer')
+var readFileSync = require('fs').readFileSync
+
+// init
+var renderer = new Renderer({
+  template: readFileSync('./docs/index.template.html', 'utf-8').,
+  config: {
+    name: 'docsify',
+    repo: 'qingwei-li/docsify'
+  }
+})
+
+renderer.renderToString(url)
+  .then(html => {})
+  .catch(err => {})
+```
@@ -7,10 +7,10 @@
  <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@next/lib/themes/vue.css" title="vue">
-  <!-- <link rel="stylesheet" href="//unpkg.com/docsify@next/lib/themes/dark.css" title="dark" disabled> -->
-  <!-- <link rel="stylesheet" href="//unpkg.com/docsify@next/lib/themes/buble.css" title="buble" disabled> -->
-  <!-- <link rel="stylesheet" href="//unpkg.com/docsify@next/lib/themes/pure.css" title="pure" disabled> -->
+  <link rel="stylesheet" href="//unpkg.com/docsify/lib/themes/vue.css" title="vue">
+  <link rel="stylesheet" href="//unpkg.com/docsify/lib/themes/dark.css" title="dark" disabled>
+  <link rel="stylesheet" href="//unpkg.com/docsify/lib/themes/buble.css" title="buble" disabled>
+  <link rel="stylesheet" href="//unpkg.com/docsify/lib/themes/pure.css" title="pure" disabled>
  <style>
    nav.app-nav li ul {
      min-width: 100px;
@@ -21,9 +21,9 @@
  <!--inject-app-->
  <!--inject-config-->
 </body>
-<script src="/lib/docsify.js"></script>
-<script src="/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>
+<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>
 </html>
@@ -1,3 +1,123 @@
 # Server client renderer

 See https://docsify.now.sh
+
+## Why SSR?
+- Better SEO
+- Feeling cool
+
+## Quick start
+
+Install `now` and `docsify-cli` in your project.
+
+```bash
+npm i now -g
+npm i docsify-cli -D
+```
+
+Edit `package.json`. If the documentation in `./docs` subdirectory.
+
+```json
+{
+  "name": "my-project",
+  "scripts": {
+    "start": "docsify start ."
+  },
+  "files": [
+    "docs"
+  ],
+  "docsify": {
+    "config": {
+      "basePath": "/docs/",
+      "loadSidebar": true,
+      "loadNavbar": true,
+      "coverpage": true,
+      "name": "docsify"
+    }
+  }
+}
+```
+
+Remove `index.html`
+
+!> The `basePath` just like webpack `publicPath`. You should config it if your docs is in the subdirectory.
+
+We can preview in the local to see if it works.
+
+```bash
+npm start
+
+# open http://localhost:4000
+```
+
+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
+
+```html
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <title>docsify</title>
+  <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">
+</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>
+</html>
+```
+
+The template should contain these comments for rendered app content.
+ - `<!--inject-app-->`
+ - `<!--inject-config-->`
+
+## Configuration
+
+You can configure it in a special config file, or `package.json`.
+
+```js
+module.exports = {
+  tempate: './ssr.html',
+  config: {
+   // docsify config
+  }
+}
+```
+
+## Deploy for your VPS
+
+You can run `docsify start` directly on your Node server, or write your own server app with `docsify-server-renderer`.
+
+```js
+var Renderer = require('docsify-server-renderer')
+var readFileSync = require('fs').readFileSync
+
+// init
+var renderer = new Renderer({
+  template: readFileSync('./docs/index.template.html', 'utf-8').,
+  config: {
+    name: 'docsify',
+    repo: 'qingwei-li/docsify'
+  }
+})
+
+renderer.renderToString(url)
+  .then(html => {})
+  .catch(err => {})
+```
@@ -18,5 +18,6 @@
 - [兼容 Vue](zh-cn/vue.md)
 - [CDN](zh-cn/cdn.md)
 - [离线模式(PWA)](zh-cn/pwa.md)
+  - [服务端渲染 (SSR)](zh-cn/ssr.md)

 - [Changelog](zh-cn/changelog.md)
@@ -0,0 +1,124 @@
+# Server client renderer
+
+See https://docsify.now.sh
+
+## Why SSR?
+- Better SEO
+- Feeling cool
+
+## Quick start
+
+Install `now` and `docsify-cli` in your project.
+
+```bash
+npm i now -g
+npm i docsify-cli -D
+```
+
+2. Edit `package.json`. If the documentation in `./docs` subdirectory.
+
+```json
+{
+  "name": "my-project",
+  "scripts": {
+    "start": "docsify start ."
+  },
+  "files": [
+    "docs"
+  ],
+  "docsify": {
+    "config": {
+      "basePath": "/docs/",
+      "loadSidebar": true,
+      "loadNavbar": true,
+      "coverpage": true,
+      "name": "docsify"
+    }
+  }
+}
+```
+
+
+Remove `index.html`
+
+!> The `basePath` just like webpack `publicPath`. You should config it if your docs is in the subdirectory.
+
+We can preview in the local to see if it works.
+
+```bash
+npm start
+
+# open http://localhost:4000
+```
+
+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
+
+```html
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <title>docsify</title>
+  <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">
+</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>
+</html>
+```
+
+The template should contain these comments for rendered app content.
+ - `<!--inject-app-->`
+ - `<!--inject-config-->`
+
+## Configuration
+
+You can configure it in a special config file, or `package.json`.
+
+```js
+module.exports = {
+  tempate: './ssr.html',
+  config: {
+   // docsify config
+  }
+}
+```
+
+## Deploy for your VPS
+
+You can run `docsify start` directly on your Node server, or write your own server app with `docsify-server-renderer`.
+
+```js
+var Renderer = require('docsify-server-renderer')
+var readFileSync = require('fs').readFileSync
+
+// init
+var renderer = new Renderer({
+  template: readFileSync('./docs/index.template.html', 'utf-8').,
+  config: {
+    name: 'docsify',
+    repo: 'qingwei-li/docsify'
+  }
+})
+
+renderer.renderToString(url)
+  .then(html => {})
+  .catch(err => {})
+```
@@ -3493,11 +3493,11 @@ var HTML5History = (function (History$$1) {
      path = path.slice(0, queryIndex);
    }

-    var base = getPath(location.origin, this.getBasePath());
+    var base = getPath(location.origin);
    var baseIndex = path.indexOf(base);

    if (baseIndex > -1) {
-      path = path.slice(baseIndex + base.length - 1);
+      path = path.slice(baseIndex + base.length);
    }

    return {
@@ -1,6 +1,6 @@
 {
  "name": "docsify",
-  "version": "4.0.2",
+  "version": "4.1.1",
  "description": "A magical documentation generator.",
  "author": {
    "name": "qingwei-li",
@@ -35,6 +35,7 @@
    "zoom-image": "^0.1.4"
  },
  "devDependencies": {
+    "babel-preset-es2015": "^6.24.1",
    "cssnano": "^3.10.0",
    "eslint": "^3.18.0",
    "eslint-config-vue": "^2.0.2",
@@ -43,7 +44,7 @@
    "postcss": "^5.2.16",
    "postcss-salad": "^1.0.8",
    "rollup": "^0.41.6",
-    "rollup-plugin-async": "^1.2.0",
+    "rollup-plugin-babel": "^2.7.1",
    "rollup-plugin-buble": "^0.15.0",
    "rollup-plugin-commonjs": "^8.0.2",
    "rollup-plugin-node-resolve": "^2.0.0",
@@ -21,7 +21,7 @@ var renderer = new Renderer({
  }
 })

-renderer.renderToString({ url })
+renderer.renderToString(url)
  .then(html => {})
  .catch(err => {})
 ```
@@ -64,13 +64,13 @@ export default class Renderer {

    if (loadSidebar) {
      const name = loadSidebar === true ? '_sidebar.md' : loadSidebar
-      const sidebarFile = this._getPath(resolve(url, `../${name}`))
+      const sidebarFile = this._getPath(resolve(url, `./${name}`))
      this._renderHtml('sidebar', await this._render(sidebarFile, 'sidebar'))
    }

    if (loadNavbar) {
      const name = loadNavbar === true ? '_navbar.md' : loadNavbar
-      const navbarFile = this._getPath(resolve(url, `../${name}`))
+      const navbarFile = this._getPath(resolve(url, `./${name}`))
      this._renderHtml('navbar', await this._render(navbarFile, 'navbar'))
    }

@@ -131,7 +131,7 @@ export default class Renderer {

      const fileName = basename(filePath)

-      await this._loadFile(cwd(filePath, '../..', fileName))
+      return await this._loadFile(cwd(filePath, '../..', fileName))
    }
  }
 }
@@ -1,6 +1,6 @@
 {
  "name": "docsify-server-renderer",
-  "version": "4.0.2",
+  "version": "4.1.1",
  "description": "docsify server renderer",
  "author": {
    "name": "qingwei-li",
@@ -51,11 +51,11 @@ export class HTML5History extends History {
      path = path.slice(0, queryIndex)
    }

-    const base = getPath(location.origin, this.getBasePath())
+    const base = getPath(location.origin)
    const baseIndex = path.indexOf(base)

    if (baseIndex > -1) {
-      path = path.slice(baseIndex + base.length - 1)
+      path = path.slice(baseIndex + base.length)
    }

    return {
Author	SHA1	Message	Date
qingwei.li	5a0c37fcd3	[release] 4.1.1	2017-05-30 13:15:13 +08:00
qingwei.li	1462efedcd	[build] 4.1.1	2017-05-30 13:15:13 +08:00
qingwei.li	4cb20a5f9d	fix: build for ssr package	2017-05-30 13:13:41 +08:00
qingwei.li	490c8a19d3	docs(ssr): update sidebar	2017-05-30 12:55:09 +08:00
qingwei.li	4b838247ea	change: update	2017-05-30 12:52:52 +08:00
qingwei.li	b091f3f10d	docs(ssr): update	2017-05-30 12:36:23 +08:00
qingwei.li	0e74e6c15e	fix: remove history mode	2017-05-30 12:16:26 +08:00
qingwei.li	be8358fcdc	[release] 4.1.0	2017-05-30 12:14:33 +08:00
qingwei.li	1ae0a9a845	[build] 4.1.0	2017-05-30 12:14:33 +08:00
qingwei.li	7e169ad154	docs(changelog): 4.1.0	2017-05-30 12:05:25 +08:00
qingwei.li	8595c99c0b	docs(ssr): add ssr	2017-05-30 11:54:37 +08:00