Pandoc与<pre> elements resistant to minification

时间:2018-03-29 13:58:09

标签: html minify pandoc

I use Pandoc to transform Markdown files to HTML ones and have issues with code snippets that get transformed to HTML <pre> snippets.

Sample Markdown input:

```json
{
   "pageNumber": 1,
   "pageCount": 12,
   "nextPage": 2,
   "pageSize": 25,
   "totalCount": 298,
   "page": [
      {
         ...item...
      },
      {
         ...item...
      },
      {
         ...item...
      }
   ]
}
```

Is converted using pandoc in.md -f markdown -t html -o out.html to

<div class="sourceCode" id="cb2"><pre class="sourceCode json"><code class="sourceCode json"><a class="sourceLine" id="cb2-1" data-line-number="1"><span class="fu">{</span></a>
<a class="sourceLine" id="cb2-2" data-line-number="2">   <span class="dt">"pageNumber"</span><span class="fu">:</span> <span class="dv">1</span><span class="fu">,</span></a>
<a class="sourceLine" id="cb2-3" data-line-number="3">   <span class="dt">"pageCount"</span><span class="fu">:</span> <span class="dv">12</span><span class="fu">,</span></a>
<a class="sourceLine" id="cb2-4" data-line-number="4">   <span class="dt">"nextPage"</span><span class="fu">:</span> <span class="dv">2</span><span class="fu">,</span></a>
<a class="sourceLine" id="cb2-5" data-line-number="5">   <span class="dt">"pageSize"</span><span class="fu">:</span> <span class="dv">25</span><span class="fu">,</span></a>
<a class="sourceLine" id="cb2-6" data-line-number="6">   <span class="dt">"totalCount"</span><span class="fu">:</span> <span class="dv">298</span><span class="fu">,</span></a>
<a class="sourceLine" id="cb2-7" data-line-number="7">   <span class="dt">"page"</span><span class="fu">:</span> <span class="ot">[</span></a>
<a class="sourceLine" id="cb2-8" data-line-number="8">      <span class="fu">{</span></a>
<a class="sourceLine" id="cb2-9" data-line-number="9">         <span class="er">...item...</span></a>
<a class="sourceLine" id="cb2-10" data-line-number="10">      <span class="fu">}</span><span class="ot">,</span></a>
<a class="sourceLine" id="cb2-11" data-line-number="11">      <span class="fu">{</span></a>
<a class="sourceLine" id="cb2-12" data-line-number="12">         <span class="er">...item...</span></a>
<a class="sourceLine" id="cb2-13" data-line-number="13">      <span class="fu">}</span><span class="ot">,</span></a>
<a class="sourceLine" id="cb2-14" data-line-number="14">      <span class="fu">{</span></a>
<a class="sourceLine" id="cb2-15" data-line-number="15">         <span class="er">...item...</span></a>
<a class="sourceLine" id="cb2-16" data-line-number="16">      <span class="fu">}</span></a>
<a class="sourceLine" id="cb2-17" data-line-number="17">   <span class="ot">]</span></a>
<a class="sourceLine" id="cb2-18" data-line-number="18"><span class="fu">}</span></a></code></pre></div>

That's fine. But as my server minifies all HTMLs, the browser will get it without line breaks as

<div class="sourceCode" id="cb2"><pre class="sourceCode json"><code class="sourceCode json"><a class="sourceLine" id="cb2-1" data-line-number="1"><span class="fu">{</span></a><a class="sourceLine" id="cb2-2" data-line-number="2"> <span class="dt">"pageNumber"</span><span class="fu">:</span> <span class="dv">1</span><span class="fu">,</span></a><a class="sourceLine" id="cb2-3" data-line-number="3"> <span class="dt">"pageCount"</span><span class="fu">:</span> <span class="dv">12</span><span class="fu">,</span></a><a class="sourceLine" id="cb2-4" data-line-number="4"> <span class="dt">"nextPage"</span><span class="fu">:</span> <span class="dv">2</span><span class="fu">,</span></a><a class="sourceLine" id="cb2-5" data-line-number="5"> <span class="dt">"pageSize"</span><span class="fu">:</span> <span class="dv">25</span><span class="fu">,</span></a><a class="sourceLine" id="cb2-6" data-line-number="6"> <span class="dt">"totalCount"</span><span class="fu">:</span> <span class="dv">298</span><span class="fu">,</span></a><a class="sourceLine" id="cb2-7" data-line-number="7"> <span class="dt">"page"</span><span class="fu">:</span> <span class="ot">[</span></a><a class="sourceLine" id="cb2-8" data-line-number="8"> <span class="fu">{</span></a><a class="sourceLine" id="cb2-9" data-line-number="9"> <span class="er">...item...</span></a><a class="sourceLine" id="cb2-10" data-line-number="10"> <span class="fu">}</span><span class="ot">,</span></a><a class="sourceLine" id="cb2-11" data-line-number="11"> <span class="fu">{</span></a><a class="sourceLine" id="cb2-12" data-line-number="12"> <span class="er">...item...</span></a><a class="sourceLine" id="cb2-13" data-line-number="13"> <span class="fu">}</span><span class="ot">,</span></a><a class="sourceLine" id="cb2-14" data-line-number="14"> <span class="fu">{</span></a><a class="sourceLine" id="cb2-15" data-line-number="15"> <span class="er">...item...</span></a><a class="sourceLine" id="cb2-16" data-line-number="16"> <span class="fu">}</span></a><a class="sourceLine" id="cb2-17" data-line-number="17"> <span class="ot">]</span></a><a class="sourceLine" id="cb2-18" data-line-number="18"><span class="fu">}</span></a></code></pre></div>

And the browser will display the code snippet as just one line.

Can I instruct Pandoc to produce the HTML resistant to minification? E.g. having a <pre> with just the code, whithout all the other bells and whistles, would be enough.

1 个答案:

答案 0 :(得分:0)

只需使用--no-highlight选项:

  

即使给出了语言属性,也禁止对代码块和内联代码使用语法突出显示。

在您的示例中:

pandoc in.md --no-highlight -o out.html

产生:

<pre class="json"><code>{
   &quot;pageNumber&quot;: 1,
   &quot;pageCount&quot;: 12,
   &quot;nextPage&quot;: 2,
   &quot;pageSize&quot;: 25,
   &quot;totalCount&quot;: 298,
   &quot;page&quot;: [
      {
         ...item...
      },
      {
         ...item...
      },
      {
         ...item...
      }
   ]
}</code></pre>