zenn-markdown-html 0.1.111-alpha.3 → 0.1.112
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +12 -3
- package/lib/index.js +85 -76
- package/lib/prism-plugins/prism-diff-highlight.d.ts +1 -0
- package/lib/prism-plugins/prism-diff-highlight.js +671 -95
- package/lib/utils/helper.js +46 -37
- package/lib/utils/highlight.js +592 -34
- package/lib/utils/md-br.js +75 -60
- package/lib/utils/md-container.js +45 -40
- package/lib/utils/md-custom-block.js +179 -138
- package/lib/utils/md-katex.js +127 -133
- package/lib/utils/md-linkify-to-card.js +104 -92
- package/lib/utils/md-renderer-fence.js +94 -76
- package/lib/utils/url-matcher.js +44 -32
- package/package.json +11 -5
package/README.md
CHANGED
|
@@ -1,11 +1,20 @@
|
|
|
1
1
|
# Zenn Markdown Html
|
|
2
|
-
Convert markdown text to html.
|
|
3
2
|
|
|
4
|
-
|
|
3
|
+
マークダウンを HTML へ変換するためのライブラリ。
|
|
4
|
+
|
|
5
|
+
## 使い方
|
|
5
6
|
|
|
6
7
|
```js
|
|
7
|
-
import markdownToHtml from
|
|
8
|
+
import markdownToHtml from 'zenn-markdown-html';
|
|
8
9
|
const html = markdownToHtml(markdown);
|
|
9
10
|
```
|
|
10
11
|
|
|
12
|
+
## 使用できる Markdown の記法について
|
|
13
|
+
|
|
14
|
+
- [Zenn の Markdown 記法一覧 | Zenn](https://zenn.dev/zenn/articles/markdown-guide)
|
|
15
|
+
|
|
16
|
+
## 開発者向けのドキュメント
|
|
17
|
+
|
|
18
|
+
## Babel の使用について
|
|
11
19
|
|
|
20
|
+
`zenn-markdown-html` では、PrismJS の言語プラグインを予め全て読み込むために `babel-plugin-prismjs` を使用しているため、ソースコードのビルドには `babel` を使用し、型ファイル(\*.d.ts)のビルドには `tsc` を使用してビルドしています。
|
package/lib/index.js
CHANGED
|
@@ -1,80 +1,89 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
|
|
8
|
+
var _markdownIt = _interopRequireDefault(require("markdown-it"));
|
|
9
|
+
|
|
10
|
+
var _crypto = _interopRequireDefault(require("crypto"));
|
|
11
|
+
|
|
12
|
+
var _mdContainer = require("./utils/md-container");
|
|
13
|
+
|
|
14
|
+
var _mdRendererFence = require("./utils/md-renderer-fence");
|
|
15
|
+
|
|
16
|
+
var _mdLinkifyToCard = require("./utils/md-linkify-to-card");
|
|
17
|
+
|
|
18
|
+
var _mdKatex = require("./utils/md-katex");
|
|
19
|
+
|
|
20
|
+
var _mdBr = require("./utils/md-br");
|
|
21
|
+
|
|
22
|
+
var _mdCustomBlock = require("./utils/md-custom-block");
|
|
23
|
+
|
|
24
|
+
var _markdownItImsize = _interopRequireDefault(require("@steelydylan/markdown-it-imsize"));
|
|
25
|
+
|
|
26
|
+
var _markdownItAnchor = _interopRequireDefault(require("markdown-it-anchor"));
|
|
27
|
+
|
|
28
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
29
|
+
|
|
8
30
|
// plugis
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
var md = (0, markdown_it_1.default)({
|
|
23
|
-
breaks: true,
|
|
24
|
-
linkify: true,
|
|
31
|
+
const mdContainer = require('markdown-it-container');
|
|
32
|
+
|
|
33
|
+
const mdFootnote = require('markdown-it-footnote');
|
|
34
|
+
|
|
35
|
+
const mdTaskLists = require('markdown-it-task-lists');
|
|
36
|
+
|
|
37
|
+
const mdInlineComments = require('markdown-it-inline-comments');
|
|
38
|
+
|
|
39
|
+
const mdLinkAttributes = require('markdown-it-link-attributes');
|
|
40
|
+
|
|
41
|
+
const md = (0, _markdownIt.default)({
|
|
42
|
+
breaks: true,
|
|
43
|
+
linkify: true
|
|
25
44
|
});
|
|
26
|
-
md.linkify.set({
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
'<div class="footnotes-title">脚注</div>\n' +
|
|
68
|
-
'<ol class="footnotes-list">\n';
|
|
69
|
-
};
|
|
70
|
-
var markdownToHtml = function (text) {
|
|
71
|
-
if (!(text && text.length))
|
|
72
|
-
return '';
|
|
73
|
-
// docIdは複数のコメントが1ページに指定されたときに脚注のリンク先が重複しないように指定する
|
|
74
|
-
// 1ページの中で重複しなければ問題ないため、ごく短いランダムな文字列とする
|
|
75
|
-
// - https://github.com/zenn-dev/zenn-community/issues/356
|
|
76
|
-
// - https://github.com/markdown-it/markdown-it-footnote/pull/8
|
|
77
|
-
var docId = crypto_1.default.randomBytes(2).toString('hex');
|
|
78
|
-
return md.render(text, { docId: docId });
|
|
45
|
+
md.linkify.set({
|
|
46
|
+
fuzzyLink: false
|
|
47
|
+
});
|
|
48
|
+
md.use(_mdBr.mdBr).use(_mdRendererFence.mdRendererFence).use(_markdownItImsize.default).use(_mdCustomBlock.mdCustomBlock).use(mdContainer, 'details', _mdContainer.containerDetailsOptions).use(mdContainer, 'message', _mdContainer.containerMessageOptions).use(mdFootnote).use(mdTaskLists, {
|
|
49
|
+
enabled: true
|
|
50
|
+
}).use(mdInlineComments).use(mdLinkAttributes, [// 内部リンク
|
|
51
|
+
{
|
|
52
|
+
pattern: /^(?:https:\/\/zenn\.dev$)|(?:https:\/\/zenn\.dev\/.*$)/,
|
|
53
|
+
attrs: {
|
|
54
|
+
target: '_blank'
|
|
55
|
+
}
|
|
56
|
+
}, // 外部リンク
|
|
57
|
+
{
|
|
58
|
+
pattern: /^https?:\/\//,
|
|
59
|
+
attrs: {
|
|
60
|
+
target: '_blank',
|
|
61
|
+
rel: 'nofollow noopener noreferrer'
|
|
62
|
+
}
|
|
63
|
+
}]).use(_markdownItAnchor.default, {
|
|
64
|
+
level: [1, 2, 3, 4],
|
|
65
|
+
permalink: _markdownItAnchor.default.permalink.ariaHidden({
|
|
66
|
+
placement: 'before',
|
|
67
|
+
class: 'header-anchor-link',
|
|
68
|
+
symbol: ''
|
|
69
|
+
}),
|
|
70
|
+
tabIndex: false
|
|
71
|
+
}).use(_mdKatex.mdKatex).use(_mdLinkifyToCard.mdLinkifyToCard); // custom footnote
|
|
72
|
+
|
|
73
|
+
md.renderer.rules.footnote_block_open = () => '<section class="footnotes">\n' + '<div class="footnotes-title">脚注</div>\n' + '<ol class="footnotes-list">\n';
|
|
74
|
+
|
|
75
|
+
const markdownToHtml = text => {
|
|
76
|
+
if (!(text && text.length)) return ''; // docIdは複数のコメントが1ページに指定されたときに脚注のリンク先が重複しないように指定する
|
|
77
|
+
// 1ページの中で重複しなければ問題ないため、ごく短いランダムな文字列とする
|
|
78
|
+
// - https://github.com/zenn-dev/zenn-community/issues/356
|
|
79
|
+
// - https://github.com/markdown-it/markdown-it-footnote/pull/8
|
|
80
|
+
|
|
81
|
+
const docId = _crypto.default.randomBytes(2).toString('hex');
|
|
82
|
+
|
|
83
|
+
return md.render(text, {
|
|
84
|
+
docId
|
|
85
|
+
});
|
|
79
86
|
};
|
|
80
|
-
|
|
87
|
+
|
|
88
|
+
var _default = markdownToHtml;
|
|
89
|
+
exports.default = _default;
|
|
@@ -2,5 +2,6 @@
|
|
|
2
2
|
* PrismJSのDiff構文を使用できるようにするためのプラグイン
|
|
3
3
|
* ソースコードの大部分は、以下のファイルより抜き出したもの
|
|
4
4
|
* @reference https://github.com/PrismJS/prism/blob/master/plugins/diff-highlight/prism-diff-highlight.js
|
|
5
|
+
* @note `babel-plugin-prismjs`によって全ての言語プラグインを読み込んでいるため`locaLanguages()`の実行はしていない
|
|
5
6
|
*/
|
|
6
7
|
export declare function enableDiffHighlight(): void;
|