修复md图片显示

This commit is contained in:
Antecer 2024-04-06 03:01:44 +08:00
parent a50a433233
commit bc5fc7cc03
7 changed files with 141 additions and 96 deletions

File diff suppressed because one or more lines are too long

View File

@ -1,97 +1,132 @@
/* .theme-vs2015-min pre code.hljs {
display: block;
overflow-x: auto;
padding: 1em;
}
Atom One Dark With support for ReasonML by Gidi Morris, based off work by Daniel Gamage .theme-vs2015-min code.hljs {
padding: 3px 5px;
}
Original One Dark Syntax theme from https://github.com/atom/one-dark-syntax .theme-vs2015-min .hljs {
background: #1e1e1e;
color: #dcdcdc;
padding: 1rem;
display: block;
}
*/ .theme-vs2015-min .hljs-keyword,
.hljs { .theme-vs2015-min .hljs-literal,
color: #abb2bf; .theme-vs2015-min .hljs-name,
background: #282c34; .theme-vs2015-min .hljs-symbol {
color: #569cd6;
} }
.hljs-keyword,
.hljs-operator { .theme-vs2015-min .hljs-link {
color: #f92672; color: #569cd6;
text-decoration: underline;
} }
.hljs-pattern-match {
color: #f92672; .theme-vs2015-min .hljs-built_in,
.theme-vs2015-min .hljs-type {
color: #4ec9b0;
} }
.hljs-pattern-match .hljs-constructor {
color: #61aeee; .theme-vs2015-min .hljs-class,
.theme-vs2015-min .hljs-number {
color: #b8d7a3;
} }
.hljs-function {
color: #61aeee; .theme-vs2015-min .hljs-meta .hljs-string,
.theme-vs2015-min .hljs-string {
color: #d69d85;
} }
.hljs-function .hljs-params {
color: #a6e22e; .theme-vs2015-min .hljs-regexp,
.theme-vs2015-min .hljs-template-tag {
color: #9a5334;
} }
.hljs-function .hljs-params .hljs-typing {
color: #fd971f; .theme-vs2015-min .hljs-formula,
.theme-vs2015-min .hljs-function,
.theme-vs2015-min .hljs-params,
.theme-vs2015-min .hljs-subst,
.theme-vs2015-min .hljs-title {
color: #dcdcdc;
} }
.hljs-module-access .hljs-module {
color: #7e57c2; .theme-vs2015-min .hljs-comment,
.theme-vs2015-min .hljs-quote {
color: #57a64a;
font-style: italic;
} }
.hljs-constructor {
color: #e2b93d; .theme-vs2015-min .hljs-doctag {
color: #608b4e;
} }
.hljs-constructor .hljs-string {
color: #9ccc65; .theme-vs2015-min .hljs-meta,
.theme-vs2015-min .hljs-meta .hljs-keyword,
.theme-vs2015-min .hljs-tag {
color: #9b9b9b;
} }
.hljs-comment,
.hljs-quote { .theme-vs2015-min .hljs-template-variable,
color: #b18eb1; .theme-vs2015-min .hljs-variable {
font-style: italic; color: #bd63c5;
} }
.hljs-doctag,
.hljs-formula { .theme-vs2015-min .hljs-attr,
color: #c678dd; .theme-vs2015-min .hljs-attribute {
color: #9cdcfe;
} }
.hljs-section,
.hljs-name, .theme-vs2015-min .hljs-section {
.hljs-selector-tag, color: gold;
.hljs-deletion,
.hljs-subst {
color: #e06c75;
} }
.hljs-literal {
color: #56b6c2; .theme-vs2015-min .hljs-emphasis {
font-style: italic;
} }
.hljs-string,
.hljs-regexp, .theme-vs2015-min .hljs-strong {
.hljs-addition, font-weight: 700;
.hljs-attribute,
.hljs-meta .hljs-string {
color: #98c379;
} }
.hljs-built_in,
.hljs-title.class_, .theme-vs2015-min .hljs-bullet,
.hljs-class .hljs-title { .theme-vs2015-min .hljs-selector-attr,
color: #e6c07b; .theme-vs2015-min .hljs-selector-class,
.theme-vs2015-min .hljs-selector-id,
.theme-vs2015-min .hljs-selector-pseudo,
.theme-vs2015-min .hljs-selector-tag {
color: #d7ba7d;
} }
.hljs-attr,
.hljs-variable, .theme-vs2015-min .hljs-addition {
.hljs-template-variable, background-color: #144212;
.hljs-type, display: inline-block;
.hljs-selector-class, width: 100%;
.hljs-selector-attr,
.hljs-selector-pseudo,
.hljs-number {
color: #d19a66;
} }
.hljs-symbol,
.hljs-bullet, .theme-vs2015-min .hljs-deletion {
.hljs-link, background-color: #600;
.hljs-meta, display: inline-block;
.hljs-selector-id, width: 100%;
.hljs-title {
color: #61aeee;
} }
.hljs-emphasis {
font-style: italic; pre {
position: relative;
} }
.hljs-strong {
font-weight: bold; small {
} position: absolute;
.hljs-link { top: 0;
text-decoration: underline; right: 0;
text-transform: uppercase;
font-weight: 700;
font-size: 0.75rem;
padding: 0.25rem 0.5rem;
background-color: #7777;
border-bottom-left-radius: 0.375rem;
color: #dcdcdc;
} }

View File

@ -1,31 +1,34 @@
require.config({ require.config({
baseUrl: 'js', baseUrl: 'js',
paths: { paths: {
markdownit: 'markdown-it.min', marked: 'marked.min',
markedHighlight: 'marked-highlight.umd',
highlight: 'highlight.min', highlight: 'highlight.min',
}, },
shim: { shim: {
marked: {
exports: 'marked',
},
markedHighlight: {
exports: 'markedHighlight',
},
highlight: { highlight: {
exports: 'hljs', exports: 'hljs',
}, },
}, },
}); });
require(['markdownit', 'highlight'], (mdit, hljs) => { require(['marked', 'markedHighlight', 'highlight'], (marked, mdhl, hljs) => {
const md = mdit({ marked.use(
html: false, // 在源代码中启用 HTML 标签 mdhl.markedHighlight({
xhtmlOut: false, // 使用“/”关闭单个标签 (<br />)。 这仅用于完全兼容 CommonMark。 langPrefix: 'theme-vs2015-min hljs language-',
breaks: false, // 将段落中的 '\n' 转换为 <br> highlight(code, lang) {
langPrefix: 'language-', // 代码块的 CSS 属性前缀。用于代码高亮插件。 const language = hljs.getLanguage(lang) ? lang : 'plaintext';
linkify: false, // 自动将类似 URL 的文本转换为链接 const result = hljs.highlight(code, {language});
typographer: false, // 启用一些语言中立的替换+引号美化 return result.value;
quotes: '“”‘’', },
highlight: function (code, lang) { })
let language = hljs.getLanguage(lang)?.name ?? 'plaintext'; );
if (language.includes('HTML')) language = 'xml';
return hljs.highlight(code, {language}).value;
},
});
const path = '/help/md/'; const path = '/help/md/';
const file = location.hash.slice(1).trim(); const file = location.hash.slice(1).trim();
@ -33,6 +36,6 @@ require(['markdownit', 'highlight'], (mdit, hljs) => {
fetch(`${path}${file}.md`) fetch(`${path}${file}.md`)
.then((response) => response.text()) .then((response) => response.text())
.then((md_text) => { .then((md_text) => {
document.getElementById('mdviewer').innerHTML = md.render(md_text); document.getElementById('mdviewer').innerHTML = marked.parse(md_text);
}); });
}); });

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,3 @@
(function(global,factory){typeof exports==='object'&&typeof module!=='undefined'?factory(exports):typeof define==='function'&&define.amd?define(['exports'],factory):(global=typeof globalThis!=='undefined'?globalThis:global||self,factory(global.markedHighlight={}))})(this,(function(exports){'use strict';function markedHighlight(options){if(typeof options==='function'){options={highlight:options}}if(!options||typeof options.highlight!=='function'){throw new Error('Must provide highlight function');}if(typeof options.langPrefix!=='string'){options.langPrefix='language-'}return{async:!!options.async,walkTokens(token){if(token.type!=='code'){return}const lang=getLang(token.lang);if(options.async){return Promise.resolve(options.highlight(token.text,lang,token.lang||'')).then(updateToken(token))}const code=options.highlight(token.text,lang,token.lang||'');if(code instanceof Promise){throw new Error('markedHighlight is not set to async but the highlight function is async. Set the async option to true on markedHighlight to await the async highlight function.');}updateToken(token)(code)},renderer:{code(code,infoString,escaped){const lang=getLang(infoString);const classAttr=lang?`${options.langPrefix}${escape(lang)}`:'';code=code.replace(/\n$/,'');return`
<pre class="${classAttr}"><span class="hljs"><code>${escaped?code:escape(code,true)}\n</code></span><small calss="lang-label">${lang}</small></pre>
`}}}}function getLang(lang){return(lang||'').match(/\S*/)[0]}function updateToken(token){return(code)=>{if(typeof code==='string'&&code!==token.text){token.escaped=true;token.text=code}}}const escapeTest=/[&<>"']/;const escapeReplace=new RegExp(escapeTest.source,'g');const escapeTestNoEncode=/[<>"']|&(?!(#\d{1,7}|#[Xx][a-fA-F0-9]{1,6}|\w+);)/;const escapeReplaceNoEncode=new RegExp(escapeTestNoEncode.source,'g');const escapeReplacements={'&':'&amp;','<':'&lt;','>':'&gt;','"':'&quot;',"'":'&#39;'};const getEscapeReplacement=(ch)=>escapeReplacements[ch];function escape(html,encode){if(encode){if(escapeTest.test(html)){return html.replace(escapeReplace,getEscapeReplacement)}}else{if(escapeTestNoEncode.test(html)){return html.replace(escapeReplaceNoEncode,getEscapeReplacement)}}return html}exports.markedHighlight=markedHighlight}));

File diff suppressed because one or more lines are too long

View File

@ -31,7 +31,7 @@ _注本文所有代码均通过 Chrome(版本 123.0.6312.86) 验证_
> xpath 通过"路径表达式"Path Expression来选取元素。 > xpath 通过"路径表达式"Path Expression来选取元素。
> 在形式上,"路径表达式"与传统的文件系统非常类似。 > 在形式上,"路径表达式"与传统的文件系统非常类似。
``` ```txt
# "/"斜杠作为路径内部的分割符。 # "/"斜杠作为路径内部的分割符。
# 同一个元素有绝对路径和相对路径两种写法。 # 同一个元素有绝对路径和相对路径两种写法。
# 绝对路径必须用"/"起首,后面紧跟根元素,比如/step/step/...。 # 绝对路径必须用"/"起首,后面紧跟根元素,比如/step/step/...。
@ -42,7 +42,7 @@ _注本文所有代码均通过 Chrome(版本 123.0.6312.86) 验证_
### 二、选取元素的基本规则 ### 二、选取元素的基本规则
``` ```txt
- "/":表示选取根元素 - "/":表示选取根元素
- "//":表示选取任意位置的某个元素 - "//":表示选取任意位置的某个元素
- nodename表示选指定名称的元素 - nodename表示选指定名称的元素