docsifyjs / docsifyjs/docsify

Enable pre/post processing on coverpage and sidebar

オープン
#2,393 コメント 4 件 リアクション 0 件 担当者 0 名 GitHub で見る
enhancement
主要言語
JavaScript
スター
31.5k
フォーク
5.8k
平均マージ
9日 8時間
マージ済み PR(30日)
2

説明

Hi! 👋

Firstly, thanks for your work on this project! 🙂

Today I used [patch-package](https://github.com/ds300/patch-package) to patch `docsify@4.13.1` for the project I'm working on.

The hooks beforeEach and afterEach are not used for cover neither sidebar rendering, so, any plugins cannot be used.

Here is the diff that solved my problem:

```diff
diff --git a/node_modules/docsify/lib/docsify.js b/node_modules/docsify/lib/docsify.js
index 6e616ad..3bdd961 100644
--- a/node_modules/docsify/lib/docsify.js
+++ b/node_modules/docsify/lib/docsify.js
@@ -9318,18 +9318,38 @@
return null;
}

- this._renderTo('.sidebar-nav', this.compiler.sidebar(text, maxLevel));
- var activeEl = getAndActive(this.router, '.sidebar-nav', true, true);
- if (loadSidebar && activeEl) {
- activeEl.parentNode.innerHTML +=
- this.compiler.subSidebar(subMaxLevel) || '';
- } else {
- // Reset toc
- this.compiler.subSidebar();
- }
+ var that = this;
+ this.callHook('beforeEach', text, function (text) {
+ var html;
+ var callback = function () {
+ if (opt.updatedAt) {
+ html = formatUpdated(
+ html,
+ opt.updatedAt,
+ this$1.config.formatUpdated
+ );
+ }

- // Bind event
- this._bindEventOnRendered(activeEl);
+ that.callHook('afterEach', html, function (hookData) {
+ renderMain.call(that, hookData);
+ next();
+ });
+ };
+
+
+ that._renderTo('.sidebar-nav', that.compiler.sidebar(text, maxLevel));
+ var activeEl = getAndActive(that.router, '.sidebar-nav', true, true);
+ if (loadSidebar && activeEl) {
+ activeEl.parentNode.innerHTML +=
+ that.compiler.subSidebar(subMaxLevel) || '';
+ } else {
+ // Reset toc
+ that.compiler.subSidebar();
+ }
+
+ // Bind event
+ that._bindEventOnRendered(activeEl);
+ });
};

Render.prototype._bindEventOnRendered = function _bindEventOnRendered (activeEl) {
@@ -9400,46 +9420,65 @@
};

Render.prototype._renderCover = function _renderCover (text, coverOnly) {
+ var that = this;
var el = getNode('.cover');
-
toggleClass(
- getNode('main'),
- coverOnly ? 'add' : 'remove',
- 'hidden'
+ getNode('main'),
+ coverOnly ? 'add' : 'remove',
+ 'hidden'
);
+
+ toggleClass(el, 'add', 'show');
if (!text) {
toggleClass(el, 'remove', 'show');
return;
}
+ this.callHook('beforeEach', text, function (text) {
+ var html;
+ var callback = function () {
+ if (opt.updatedAt) {
+ html = formatUpdated(
+ html,
+ opt.updatedAt,
+ this$1.config.formatUpdated
+ );
+ }

- toggleClass(el, 'add', 'show');
+ that.callHook('afterEach', html, function (hookData) {
+ renderMain.call(that, hookData);
+ next();
+ });
+ };

- var html = this.coverIsHTML ? text : this.compiler.cover(text);
+ var html = that.coverIsHTML ? text : that.compiler.cover(text);

- var m = html
- .trim()
- .match('

([^<]*?)

$');
+ var m = html
+ .trim()
+ .match('

([^<]*?)

$');

- if (m) {
- if (m[2] === 'color') {
- el.style.background = m[1] + (m[3] || '');
- } else {
- var path = m[1];
+ if (m) {
+ if (m[2] === 'color') {
+ el.style.background = m[1] + (m[3] || '');
+ } else {
+ var path = m[1];

- toggleClass(el, 'add', 'has-mask');
- if (!isAbsolutePath(m[1])) {
- path = getPath(this.router.getBasePath(), m[1]);
+ toggleClass(el, 'add', 'has-mask');
+ if (!isAbsolutePath(m[1])) {
+ path = getPath(this.router.getBasePath(), m[1]);
+ }
+
+ el.style.backgroundImage = "url(" + path + ")";
+ el.style.backgroundSize = 'cover';
+ el.style.backgroundPosition = 'center center';
}

- el.style.backgroundImage = "url(" + path + ")";
- el.style.backgroundSize = 'cover';
- el.style.backgroundPosition = 'center center';
+ html = html.replace(m[0], '');
}

- html = html.replace(m[0], '');
- }

- this._renderTo('.cover-main', html);
+ that._renderTo('.cover-main', html);
+ });
+
sticky();
};
```

This issue body was [partially generated by patch-package](https://github.com/ds300/patch-package/issues/296).

コントリビューションガイド

コントリビューションガイドを開く

評価

この issue はまだ評価されていません。

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。