diff --git a/app.js b/app.js
index ecce40197..3b0379606 100644
--- a/app.js
+++ b/app.js
@@ -1,12 +1,46 @@
var serveStatic = require('serve-static')
var http = require('http')
var fs = require('fs')
+var Renderer = require('./packages/docsify-server-renderer/build.js')
+
+var renderer = new Renderer({
+ template: `
+
+
+
+
+ docsify
+
+
+
+
+
+
+
+
+`,
+ config: {
+ name: 'docsify',
+ repo: 'qingwei-li/docsify',
+ basePath: '/docs/',
+ loadNavbar: true,
+ loadSidebar: true,
+ subMaxLevel: 3,
+ auto2top: true
+ },
+ path: './'
+})
http.createServer(function (req, res) {
serveStatic('.')(req, res, function () {
- res.writeHead(200, { 'Content-Type': 'text/html' })
+ // TEST SSR
+ // const html = renderer.renderToString(req.url)
+ // res.end(html)
+
+ res.writeHead(404, { 'Content-Type': 'text/html' })
res.end(fs.readFileSync('dev.html'))
})
}).listen(3000, '0.0.0.0')
console.log(`\nListening at http://0.0.0.0:3000\n`)
+
diff --git a/dev.html b/dev.html
index 837dbf962..bdcb9f61e 100644
--- a/dev.html
+++ b/dev.html
@@ -32,6 +32,7 @@
subMaxLevel: 2,
mergeNavbar: true,
formatUpdated: '{MM}/{DD} {HH}:{mm}',
+ routerMode: 'history',
plugins: [
function(hook) {
hook.beforeEach(function (html) {
diff --git a/packages/docsify-server-renderer/index.js b/packages/docsify-server-renderer/index.js
index acb39f2f3..06aef617b 100644
--- a/packages/docsify-server-renderer/index.js
+++ b/packages/docsify-server-renderer/index.js
@@ -30,7 +30,7 @@ export default class Renderer {
config,
cache
}) {
- this.html = this.template = template
+ this.html = template
this.path = cwd(path)
this.config = Object.assign(config, {
routerMode: 'history'
@@ -43,10 +43,12 @@ export default class Renderer {
this.router.getCurrentPath = () => this.url
this._renderHtml('inject-config', ``)
this._renderHtml('inject-app', mainTpl(config))
+
+ this.template = this.html
}
renderToString (url) {
- this.url = url
+ this.url = url = this.router.parse(url).path
// TODO render cover page
const { loadSidebar, loadNavbar } = this.config
@@ -65,19 +67,26 @@ export default class Renderer {
this._renderHtml('navbar', this._render(navbarFile, 'navbar'))
}
- return this.html
+ const html = this.html
+ this.html = this.template
+
+ return html
}
_renderHtml (match, content) {
- this.html = this.html.replace(new RegExp(``, 'g'), content)
+ return this.html = this.html.replace(new RegExp(``, 'g'), content)
}
_render (path, type) {
let html = this._loadFile(path)
+ const { subMaxLevel, maxLevel } = this.config
switch (type) {
case 'sidebar':
- html = this.compiler.sidebar(html)
+ html = this.compiler.sidebar(html, maxLevel)
+ + ``
break
case 'cover':
html = this.compiler.cover(html)
diff --git a/src/core/fetch/index.js b/src/core/fetch/index.js
index 1d937f5d8..ceba30810 100644
--- a/src/core/fetch/index.js
+++ b/src/core/fetch/index.js
@@ -2,6 +2,7 @@ import { get } from './ajax'
import { callHook } from '../init/lifecycle'
import { getParentPath } from '../router/util'
import { noop } from '../util/core'
+import { getAndActive } from '../event/sidebar'
function loadNested (path, file, next, vm, first) {
path = first ? path : path.replace(/\/$/, '')
@@ -70,7 +71,15 @@ export function fetchMixin (proto) {
}
export function initFetch (vm) {
+ const { loadSidebar } = vm.config
+
+ // server-client renderer
if (vm.rendered) {
+ const activeEl = getAndActive(vm.router, '.sidebar-nav', true, true)
+ if (loadSidebar && activeEl) {
+ activeEl.parentNode.innerHTML += window.__SUB_SIDEBAR__
+ }
+ vm._bindEventOnRendered(activeEl)
vm._fetchCover()
vm.$resetEvents()
callHook(vm, 'doneEach')
diff --git a/src/core/render/index.js b/src/core/render/index.js
index 6f26eaa9c..652d4fc19 100644
--- a/src/core/render/index.js
+++ b/src/core/render/index.js
@@ -54,10 +54,6 @@ function renderMain (html) {
} else {
this.config.executeScript && executeScript()
}
-
- if (this.config.auto2top) {
- scroll2Top(this.config.auto2top)
- }
}
function renderNameLink (vm) {
@@ -91,7 +87,12 @@ export function renderMixin (proto) {
activeEl.parentNode.innerHTML += this.compiler.subSidebar(subMaxLevel)
}
// bind event
- this.activeLink = activeEl
+ this._bindEventOnRendered()
+ }
+
+ proto._bindEventOnRendered = function (activeEl) {
+ const { autoHeader, auto2top } = this.config
+
scrollActiveSidebar(this.router)
if (autoHeader && activeEl) {
@@ -103,6 +104,8 @@ export function renderMixin (proto) {
dom.before(main, h1)
}
}
+
+ auto2top && scroll2Top(auto2top)
}
proto._renderNav = function (text) {
diff --git a/src/core/router/history/html5.js b/src/core/router/history/html5.js
index 9b7c1ab17..cb3a36831 100644
--- a/src/core/router/history/html5.js
+++ b/src/core/router/history/html5.js
@@ -10,7 +10,7 @@ export class HTML5History extends History {
}
getCurrentPath () {
- const base = this.config.base
+ const base = this.config.basePath
let path = window.location.pathname
if (base && path.indexOf(base) === 0) {