Question

似乎highlight.js将类应用于我的内容，而不是样式。我正在使用React，TypeScript和markdown-it。

这是我对package.json的更改：

  "dependencies": {
    "highlight.js": "^9.12.0",
  "devDependencies": {
    "@types/highlight.js": "^9.12.3",

这是我的降价文件：

lua
for i = 1, iterations do
    product.writeln("Starting iteration " .. tostring(i))
    product.writeln("Will run for " .. tostring(duration) .. " msec")

    project:start()
    product.msleep(onoffdelay)

    project:enable_main_power(true)

    product.msleep(duration)

    project:enable_main_power(false)
    product.msleep(onoffdelay)
    project:stop()

    product.writeln("Delaying for " .. tostring(delay) .. " msec...")

    product.msleep(delay)
end

这是我认为是React组件的相关部分，该部分以html呈现markdown。我不太擅长Typescript，所以我现在将参数的类型设置为string。我不知道在哪里可以找到lang的类型定义。

    .then(data => {
        const text = data as string;
        const converted = text.replace(/!\[([^[\]]+)\]\(([^()]+)\)/g, `![$1](${resourceFolder}$2)`);
        const hljs = require('highlight.js'); // https://highlightjs.org/
        const md = require('markdown-it')({
            html: true,
            /* tslint:disable */
            highlight: function (str: any, lang: any) {
                if (lang && hljs.getLanguage(lang)) {
                  try {
                    return hljs.highlight(lang, str).value;
                  } catch (__) {}
                }

                return ''; // use external default escaping
              }
            /* tslint:enable */
        });
        const content = md.render(converted);
        this.setState({
            html: content
        });
    });

这是呈现的html：

<pre><code class="language-lua"><span class="hljs-keyword">for</span> i = <span class="hljs-number">1</span>, iterations <span class="hljs-keyword">do</span>
    product.writeln(<span class="hljs-string">"Starting iteration "</span> .. <span class="hljs-built_in">tostring</span>(i))
    product.writeln(<span class="hljs-string">"Will run for "</span> .. <span class="hljs-built_in">tostring</span>(duration) .. <span class="hljs-string">" msec"</span>)

    project:start()
    product.msleep(onoffdelay)

    project:enable_main_power(<span class="hljs-literal">true</span>)

    product.msleep(duration)

    project:enable_main_power(<span class="hljs-literal">false</span>)
    product.msleep(onoffdelay)
    project:stop()

    product.writeln(<span class="hljs-string">"Delaying for "</span> .. <span class="hljs-built_in">tostring</span>(delay) .. <span class="hljs-string">" msec..."</span>)

    product.msleep(delay)
<span class="hljs-keyword">end</span>
</code></pre>

呈现的html看起来完全纯净，没有语法突出显示。

高亮js应用类但不应用样式

0 个答案: