shd101wyy / crossnote Goto Github PK

When a fenced code block contains another code block example, the preview unexpectedly renders <p data-line="?" class="sync-line" style="margin:0;"></p>. This happens no matter what language is present after backticks (if any). Indented code blocks are not affected.

The bug is observed both in Atom and VSCode.

Copy-pastable minimal working example (MWE)

### Fenced markdown source

````markdown
# Header in source

```javascript
console.log('nested fenced block')
```

    console.log('nested indented block')

more text
````

### Fenced plain source

````
# Header in source

```javascript
console.log('nested fenced block')
```

    console.log('nested indented block')

more text
````

### Indented source

    # Header in source

    ```javascript
    console.log('nested fenced block')
    ```

        console.log('nested indented block')

    more text

End of MWE

[Proposal] Upload image to IPFS.

https://github.com/shd101wyy/mume/blob/fe7c1a046f3b6372fc7758a44e7698bb1c20f779/src/utility.ts#L169

The table of contents is being made, as is the preface, but the actual content is not being made anymore. The eBook produced only has the few pages of front matter. Just FYI.

The following markdown source:

    - [ ] fixme

  - [ ] I'm fine

```
- [ ] I am fine, too
```

is rendered (in markdown-preview-enhanced v0.15.6) as:

(revealing the HTML source of a checkbox in the code block).

This is how GitHub renders the same thing:

- [ ] fixme

• I'm fine

- [ ] I am fine, too

I'm using wkhtmltopdf to convert html to pdf(cause I need bookmarks in pdf), but I found the .markdown-preview{left:50%;transform:translateX(-50%)} in style-template.css will make wkhtmltopdf only use right half page to print the pdf content.

After I changed the style to .markdown-preview{/*left:50%;transform:translateX(-50%)*/left:0%;transform:translateX(0%)}, the html still shows correct and wkhtmltopdf also works.

So should I do this to make wkhtmltopdf working? Will it break some browsers' compatibility?

When you export an ebook pdf none of the emojis show up

E.g.

```plantuml
A -> B: This is an included svg image: <img:foo.svg>.
A <- B: This text will never show.
`​``

There is currently no simple way of having plantuml styles in a common location. Including ~/.mume (extensionConfigDirectoryPath) in the plantuml.include.path would allow keeping plantuml styles in that directory and easily including them using !include mystylestyle.iuml.

Hello...

First of all:
Thank You for your great work. This replaces almost all my office tools atm.

I've got a problem with the speaker notes in presentation mode. For some reason the time doesn't start when I opened the window.

I checked the debugger and there is a file missing (/mume/dependencies/reveal/plugins/marked.js) referenced from here

I tryed to copy the file from reveal.js repo but it didn't resolve the issue (Uncaught ReferenceError: Reveal is not defined).

Not sure if these things are related but would be cool if time would work
Thanks

Hi @shd101wyy! 👋

@jwoLondon and I are wondering if mume can support line highlighting inside the rendered code blocks. You can find examples of this behaviour on this page: https://reactjs.org/tutorial/tutorial.html

Here is the feature at a glance:

And here's the raw markdown document:
https://raw.githubusercontent.com/reactjs/reactjs.org/master/content/tutorial/tutorial.md

Highlighted lines of code in the image above are configured this way:

```javascript{1,2,6,8}
class Square extends React.Component {
  render() {
    return (
      <button
        className="square"
        onClick={() => this.props.onClick()}
      >
        {this.props.value}
      </button>
    );
  }
}
```

I know we can't just go for ```javascript{1,2,6,8} because we've got lots of other code block keywords in mume. However, something like that could be possible:

```javascript {highlight=42}
```

```javascript {highlight=10-20}
```

```javascript {highlight=[5,7]}
```

```javascript {highlight=[1-10,15,20-22]}
```

```javascript {highlight=[1-10,15,20-22],something=value}
```

UPD (from #100 (comment)):

```javascript {highlight="1-10,15,20-22"}
```

The colour of the highlighted background could be done by means of a CSS selector, which would make styling configurable by users.

What do you think?

Hi

For a few places I've been using this trick to render my markdowns, which has worked fairly well. But I would much rather use mume.

Copying and pasting in this index.html:

<html class="no-js">
<head>
    <script src="https://code.jquery.com/jquery-3.2.1.min.js"
            integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
            crossorigin="anonymous"></script>

    <script src="https://cdn.rawgit.com/showdownjs/showdown/1.7.1/dist/showdown.min.js"></script>

    <script src="https://cdn.rawgit.com/knsv/mermaid/7.0.0/dist/mermaid.min.js"></script>
    <link rel="stylesheet" href="https://cdn.rawgit.com/knsv/mermaid/7.0.0/dist/mermaid.css">

    <script>
        $(function () {
            $.ajax('INPUTFILE.md')
                .then(function (response) {
                    var converter = new showdown.Converter()
                    converter.setFlavor('github');
                    var html = converter.makeHtml(response)
                    $('#markdownroot').html(html)
                })
                .then(function () {
                    mermaidAPI.initialize({
                        startOnLoad: true
                    });
                    mermaid.init(undefined, $('code.mermaid'));
                }).then(function() {
                    $('code.mermaid').each(function(idx, elem) {
                        var svg = elem.children[0]
                        var svg_height = svg.getBBox().height
                        $(svg).css("max-height", svg_height)
                    })
                })


        })
    </script>
</head>
<body>
<div id="markdownroot">
</div>
</body>
</html>

Could it be made available on a cdn to use in simple inline html files like this?

冒昧得问下作者大大，这个渲染器可以用Node.js的包管理器下载安装吗

I want to change some style about toc，but it seems that there is no way watch the less file change?

For example:

I need config the toc for my markdown files to generate the correct toc in html.
But I notice that I can't hide the <a id="sidebar-toc-btn">≡</a> by config, the button will make the pdf also contains the button image.

Now I need replace the <a id="sidebar-toc-btn">≡</a> to none after generated the html files from markdown, so it would be much appreciated if there is a config could do that.

Currently export paths are inferred purely based on the input path, which is generally fine, but for my scenario it'd be nice to be able to specify a custom output path instead.

href node attributes for viz.js are being "overwritten"--kindof. This blocks the ability to support hyperlinks in viz.js diagrams.

Taking the example below using the atom plugin:

  digraph G {
    subgraph cluster_0 {
      style=filled;
      color=lightgrey;
      node [style=filled,color=white];
      a0 -> a1 -> a2;
      label = "Parent Process";
    }

    subgraph cluster_1 {
  		style=bordered;
  		color=lightgrey;
  		node [style=filled,color=white];
  		b0 -> b1 -> b2;
  		label = "Child Process";
  	}

    a0 -> b1
    b2 -> c
    a2 -> c

    b0[href="https://www.netflix.com", target=_blank, fontcolor=darkgray, color=green label="Netflix"]

    b1[href="https://www.youtube.com", fontcolor=darkgray, color=red label="YouTube", shape=square]

    b2[href="https://www.live .com", fontcolor=darkgray, color=blue style=empty label="Xbox"]
  }

Here is the HTML:

<a xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="https://www.netflix.com" xlink:title="Netflix" target="_blank" href="file:////Users/[redacted]/[redacted]/[redacted]/[redacted]/[redacted]/[redacted]/[redacted]">
<ellipse fill="#00ff00" stroke="#00ff00" cx="160" cy="-266.8738" rx="38.278" ry="18"></ellipse>
<text text-anchor="middle" x="160" y="-262.6738" font-family="Times,serif" font-size="14.00" fill="#000000">Netflix</text>
</a>

If you look at the plugin, the SVG is being generated with a xlink:href attribute on the <a>, which you can see in the generated HTML. But the href is being added afterwards somehow, so Chrome or other browsers do not create the href from the xlink:href.

vscode 中，选择任何一种代码主题，如 monokai，渲染生效。但只要修改自定义样式表，预览刷新后 monokai 主题无效，重置为缺省主题。

I keep getting the following errors in vscode console:

[Embedded Page] %c 22:11:44 (987) :%cDEBUG: 
webview.ts:131 [Embedded Page] Uncaught SyntaxError: Invalid regular expression: /[ªµºÀ-ÖØ-öø-�ˆ-ˑˠ-ˤˬˮͰ-ʹͶͷͺ-ͽͿΆΈ-ΊΌΎ-ΡΣ-ϵϷ-�Ҋ-ԯԱ-Ֆՙա-և�-תװ-ײؠ-يٮٯٱ-ۓەۥۦۮۯۺ-ۼۿ�ܒ-ܯ�-ޥޱߊ-ߪߴߵߺࠀ-ࠕࠚࠤࠨࡀ-ࡘࢠ-ࢲऄ-हऽ�क़-ॡॱ-ঀঅ-ঌ��ও-নপ-রলশ-হঽৎড়�য়-ৡৰৱਅ-ਊ��ਓ-ਨਪ-ਰਲਲ਼ਵਸ਼ਸਹਖ਼-ੜਫ਼ੲ-ੴઅ-��-ઑઓ-નપ-રલળવ-હઽ�ૠૡଅ-ଌ��ଓ-ନପ-ରଲଳଵ-ହଽଡ଼�ୟ-ୡୱஃஅ-ஊஎ-�ஒ-கஙசஜஞடணதந-பம-ஹ�అ-ఌఎ-�ఒ-నప-హఽౘౙౠౡಅ-ಌಎ-�ಒ-ನಪ-ಳವ-ಹಽೞೠೡೱೲഅ-ഌഎ-�ഒ-ഺഽൎൠൡൺ-ൿඅ-ඖක-නඳ-රලව-ෆ�-ะาำเ-ๆ�ຂຄງຈຊ�ດ-ທນ-ຟມ-ຣລວສຫອ-ະາຳຽເ-ໄໆໜ-ໟༀཀ-ཇཉ-ཬྈ-ྌက-ဪဿ�-��-�����-��-�ႎႠ-ჅჇ��-ჺჼ-ቈቊ-��-ቖቘቚ-�በ-ኈኊ-��-ኰኲ-ኵኸ-ኾዀዂ-ዅወ-ዖዘ-�ጒ-ጕጘ-�ᎀ-�Ꭰ-��-ᙬᙯ-ᙿ�-ᚚᚠ-ᛪᛮ-ᛸᜀ-ᜌᜎ-ᜑᜠ-ᜱ�-��-��-�ក-ឳៗៜᠠ-ᡷᢀ-ᢨᢪᢰ-ᣵᤀ-ᤞ�-ᥭᥰ-ᥴᦀ-ᦫ�-ᧇᨀ-ᨖᨠ-ᩔᪧᬅ-ᬳᭅ-ᭋᮃ-ᮠᮮᮯᮺ-ᯥᰀ-ᰣ�-�ᱚ-ᱽᳩ-ᳬᳮ-ᳱᳵᳶᴀ-ᶿḀ-ἕἘ-�ἠ-ὅὈ-��-ὗὙὛ�Ὗ-ώᾀ-ᾴᾶ-ᾼιῂ-ῄῆ-ῌ�-ΐῖ-Ίῠ-Ῥῲ-ῴῶ-ῼ���-ₜℂℇℊ-ℓℕℙ-�ℤΩℨK-ℭℯ-ℹℼ-ℿⅅ-ⅉⅎⅠ-ↈⰀ-Ⱞⰰ-ⱞⱠ-ⳤⳫ-ⳮⳲⳳⴀ-ⴥⴧⴭⴰ-ⵧⵯⶀ-ⶖⶠ-ⶦⶨ-ⶮⶰ-ⶶⶸ-ⶾⷀ-ⷆⷈ-ⷎ�-ⷖⷘ-ⷞⸯ々-〇〡-〩〱-〵〸-〼�-ゖ�-ゟァ-ヺー-ヿㄅ-ㄭㄱ-ㆎㆠ-ㆺㇰ-ㇿ�-䶵一-鿌ꀀ-ꒌ�-ꓽꔀ-ꘌ�-ꘟꘪꘫꙀ-ꙮꙿ-�ꚠ-ꛯꜗ-ꜟꜢ-ꞈꞋ-ꞎ�-ꞭꞰꞱꟷ-�ꠃ-ꠅꠇ-ꠊꠌ-ꠢꡀ-ꡳꢂ-ꢳꣲ-ꣷꣻꤊ-ꤥꤰ-ꥆꥠ-ꥼꦄ-ꦲ�ꧠ-ꧤꧦ-ꧯꧺ-ꧾꨀ-ꨨꩀ-ꩂꩄ-ꩋꩠ-ꩶꩺꩾ-ꪯꪱꪵꪶꪹ-ꪽꫀꫂꫛ-�ꫠ-ꫪꫲ-ꫴ�-ꬆꬉ-ꬎꬑ-ꬖꬠ-ꬦꬨ-ꬮꬰ-ꭚꭜ-ꭟꭤꭥꯀ-ꯢ가-힣ힰ-ퟆퟋ-ퟻ豈-舘並-龎ff-stﬓ-ﬗ�ײַ-ﬨשׁ-זּטּ-לּמּנּ�ףּפּצּ-ﮱﯓ-ﴽ�-�ﶒ-ﷇﷰ-ﷻﹰ-ﹴﹶ-ﻼＡ-Ｚ�-ｚｦ-ﾾￂ-ￇￊ-�ￒ-ￗￚ-ￜ]/: Range out of order in character class

Don't know why this happened.

如果有几千个md文件需要批量转html 感觉每次都要调await mume.init();不现实 并且无法知道上一个文件转成功与否，作者有什么文案不？有没有批量把某一文件夹底下的md文件都转成html呢？

The plantuml.jar curretnly included in

https://github.com/shd101wyy/mume/tree/master/dependencies/plantuml

Plantuml included in dependencies generates blank images when diagrams are big

using the latest (at ‎06 ‎February ‎2019) one from plantuml does not have the issue.

Please update the dependency and better if a config option is provided to point to an specific path

I couldn't find any reference in the README about how to generate html (engine.htmlExport) without the table of content. Is it possible? I guess there is some option I haven't found yet, because markdown-enhanced doesn't generate the toc by default.

Perhaps this is already a feature somewhere that I've overlooked, but is it possible to specify the output directory and filename when running the various engine.export functions?

Right now it seems to put the output file in the same directory as the input file. In my case, the situation is something like this:

const engine = new mume.MarkdownEngine({
    filePath: "/some/directory/file.md",
    config: config
});

const result = await engine.htmlExport({ offline: false, runAllCodeChunks: true });
// Produces "/some/directory/file.html"

shd101wyy/vscode-markdown-preview-enhanced#134

The PDF generation via Chrome is great but I would like to package puppeteer locally instead of being required to have it installed globally (this can problematic in some scenarios).

It looks like the initial implementation used the requireg package and was then adjusted to with a simpler local implementation in PR #9 due to some macOS compatibility issues.

Maybe if we could get a little closer to the original requireg implementation we could allow for local puppeteer installations as well. If we change the chromeExport() method to try a native require('puppeteer') first and then use the current global check as a fallback then we could support both cases (see src/markdown-engine.ts#L1364-L1370).

Thoughts?

现在的写法是：

---
id: "my-id"
class: "my-class"
---

@import "local-style.less"

建议将 @import 命令直接整个到一起：

---
import: "local-style.less"
id: "my-id"
class: "my-class"
---

According to the docs, math blocks can be currently rendered using $$...$$, \[...\] or ```math. However, the latter option creates a counter-intuitive special case, which may be undesired by mume users.

When there is an intention to make a code block live, users are usually offered to add {cmd=true} to the block (or just {cmd} after #31). Besides, they are likely to know that {hide=true} (or just {hide}) would remove the math source and only keep the rendered result. Thus, a ’standard’ intended use of ```math for a newcomer would be the following:

source only:
```math
x=42
```

source followed by the rendered formula:
```math {cmd}
x=42
```

rendered formula only:
```math {cmd hide}
x=42
```

Unfortunately, the above would not work, because ```math is currently treated in a special way. The existing implementation, however, does not support extra options such as ```math {.class}. Even typing ```math {} breaks the magic, because the special condition does not accept anything after the language keyword.

IMO it'd be beneficial to disable this special case for ```math and advise existing users to switch to either $$ or ```math {cmd hide} in order to maintain consistency. The good thing is that the second notation will be able to support things like .custom-class and other perks that are common for any all code chunks. Importantly, users will be finally able to show the source code for the formula together with the rendered result, which is currently impossible and requires duplicating the math block in the markdown source (it is either printed or executed, but never both):

```
very long formula
```

```math
very long formula
```

instead of just

```math {cmd}
very long formula
```

I can fix this issue by pushing a new commit to #34 if you agree with my arguments for this change. WDYT @shd101wyy?

Thinking about having this within Eclipse plugin, what choices are?

I know VS Code support language server,
so if there is mume-language-server,
than using it in any IDE would be similar to any adoption of specific language -language-server.
Or I may something.

What are other ideas?

Originally reported by @pydupont in shd101wyy/vscode-markdown-preview-enhanced#87

The email addresses links are not built correctly:

[email]([email protected])

becomes something like:

<a href="file:///Path/To/File/[email protected]">email</a>

Adding a mailto doesn't change anything. I also tried to write the html link directly but the link is automatically changed back to file:///Path/To/File/[email protected].

Platform: macOS 10.12.6

I have already installed puppeteer by

npm i -g puppeteer

As I dig into this problem, I found the module global-modules return a value

'/Applications/Visual Studio Code.app/Contents/Frameworks/Code Helper.app/Contents/lib/node_modules' 

instead of

'/usr/local/lib/node_modules'

const mume = require("@shd101wyy/mume");

async function main() {
  await mume.init();

  const engine = new mume.MarkdownEngine({
    filePath: "./xxx.md",
    config: {
      previewTheme: "github-light.css",
      codeBlockTheme: 'github.css', //"auto.css",
      breakOnSingleNewLine: true,
      printBackground: true,
      enableScriptExecution: false, // <= for running code chunks
      mathRenderingOption: ''
    },
  });

  // html export
  await engine.htmlExport({ offline: true});
}

main();

It won't exit forever, I have tried to debug it and break it when the process need exit. The callstack is here:

async_hooks.js in nodejs

function emitHookFactory(symbol, name) {
  // Called from native. The asyncId stack handling is taken care of there
  // before this is called.
  // eslint-disable-next-line func-style
  const fn = function(asyncId) {
    active_hooks.call_depth += 1;
    // Use a single try/catch for all hook to avoid setting up one per
    // iteration.
    try {
      for (var i = 0; i < active_hooks.array.length; i++) {  // <------- BREAK HERE
        if (typeof active_hooks.array[i][symbol] === 'function') {
          active_hooks.array[i][symbol](asyncId);
        }
      }
    } catch (e) {
      fatalError(e);
    } finally {
      active_hooks.call_depth -= 1;
    }

    // Hooks can only be restored if there have been no recursive hook calls.
    // Also the active hooks do not need to be restored if enable()/disable()
    // weren't called during hook execution, in which case
    // active_hooks.tmp_array will be null.
    if (active_hooks.call_depth === 0 && active_hooks.tmp_array !== null) {
      restoreActiveHooks();
    }
  };

  // Set the name property of the anonymous function as it looks good in the
  // stack trace.
  Object.defineProperty(fn, 'name', {
    value: name
  });
  return fn;
}

It seems to do something with an asyncId which doesn't exist in AsyncHook's promiseIds array.
I haven't used nodejs for long time so I can't tell where goes wrong.

I'd like to propose an improvement to command chunk options and am curious what you think. Let's take this example:

```python {cmd=true hide=true}

It seems intuitive to omit =true and simply write:

```python {cmd hide}

However, the current implementation treats the above options as: {cmd: hide} because a space is the same as = for the interpreter. This is less obvious, especially in cases like these ones:

```python {cmd .class1 .class2 hide}

↓
{ class: 'class1 class2', cmd: 'hide' }

```python {cmd}

↓
{}

```python {cmd output="path.html" hide}

↓
{ cmd: 'output', 'path.html': 'hide' }

How about making = necessary for key=value options and when it is omitted, how about treating the input as key=true?

This improvement opens up a new range of opportunities for shortcuts, which can be very concise and thus time-saving for advanced users. For example, {h} can unwrap to {cmd=true hide=true} in the background. I'm not proposing this next step at the moment, just sharing thoughts on future benefits I see.

I can submit a PR for assuming =true by default. WDYT?

When there are relative images in child markdown documents, ebook pdf is not resolving the files. Here is an example:

issue.zip

mume engine can not handle markdown documents containing BOM (byte-order mark) correctly in some cases, such as front-matter, document import, ...

Is/Would it be possible to allow for additional front-matter to be placed in a separate yaml file?

In Pandoc Export-Shared Options, you mention adding _output.yaml to the directory. But this doesn't seem to be used when generating the preview?

This is what I found from an attempt to figure out a solution to an issue of markdown-preview-enhanced.

Description of the problem: for instance, $\tilde\nf$ is translated to \tildef, with \n removed, inside a MathJax expression. The following code in parse-math.js seems to be the relevant part:

  } else if (renderingOption === "MathJax") {
    const text = (openTag + content + closeTag).replace(/\n/g, "");
    const tag = displayMode ? "div" : "span";
    return `<${tag} class="mathjax-exps">${escapeString(text)}</${tag}>`;
  } else {
    return "";

When I changed replace(/\n/g, "") to replace(/\n/g, " "), the problem is resolved.

Was there some reason to remove \n, instead of the standard TeX convention which replaces \n with a space? If not, the code could be fixed as above.

Hi again @shd101wyy!

I'm currently playing with {cmd=true} and as a by-product of that would like to offer some help with code refactoring. I could start with splitting markdown-engine into a set of smaller files, which will make the code much easier to read and decouple. For example, I could help with moving export functions into a new folder called src/export rather than keeping them all in one large class. Similarly, custom syntax rules like math, emoji, critic markup etc. can go into individual files and thus become easier to update or cover with tests. Ultimately, some functionality that has been extracted into smaller and cleaner files can become node modules on their own, which sometimes happens with other libraries.

Before I start refactoring bits of mume I'd like to ask if you're happy with this suggestion in general. My guess is that the files are so large at the moment because mume started small but then grew beyond its expectations, but I might be wrong and the large files are your design decision. In the latter case extracting smaller modules might not be something you're looking forward to see.

Curious to know what you think and am happy to help if you consider refactoring potentially useful! Mume is awesome!

After generating markdown to html, the code block has long code line will have scrollbar in html, it will cause the pdf truncate the code block.

I think using the css to wrap the long code line when converting to pdf is useful. Is there any option could do this?

I'm using mume to generate my documentation web page and pdf, there are some advice:

1. embed_local_images is a very useful option for generate a standalone HTML file, but I need write down the option inside every document, add an option on engine side is very helpful to set it to true for all documents by default.
2. In resolved-image-paths.js, there is one line img.attr(srcTag, resolveFilePath(src, options.useRelativeFilePath));, the resolveFilePath will add "file:///" and treat it as the local link if the link is start from /, but I think it is also used for the online url not only the local files. So I think it would be helpful to give an option which could let users to decide whether they want to treat it as a online link or local file link.
3. style-template.css is not very suitable in some cases and I want to modify it. I see this file's path is hard-coded, please give an option to use a custom one.
4. Code block will have a scroll bar if the code line is too long, it will have problem when exporting to PDF, I have changed word-wrap and white-space CSS style to get rid of scroll bar, I think it would be helpful to correct the default CSS files.
5. Just a personal suggestion: the wkhtmltopdf would be a better tool to generate the PDF files without installing additional dependencies.

On windows 10 I keep getting:

Error: ImageMagick is required to be installed to convert svg to png.
Error: Command failed: convert C:\Users\smag\AppData\Local\Temp\mume-svg118102-12668-1lvlnjv.rk2q.svg C:\Users\[userid]\Desktop\MPE_tryout\assets\1d71d338ce53e8b5769d5adbe4ce262b0.png
Invalid Parameter - C:\Users\[userid]\Desktop\MPE_tryout\assets\1d71d338ce53e8b5769d5adbe4ce262b0.png

The first line is printed from line 16 of src/magick.ts, but the third line is actually from a build in windows command shadowing for ImageMagicks convert.
See http://www.imagemagick.org/Usage/windows/#convert_issue.

They suggest that applications using these tools rename ImageMagicks tools, and configure where to find them.

So I guess that ImageMagick tools shold have a imagemagick.json in ~/.mume/

this is a duplicate of shd101wyy/vscode-markdown-preview-enhanced#1472, but I suppose its more relevant here...

I hope there will be a fix some how.

The current version is pretty old. Please :)

I have below table, each item is a picture. It works perfect in previous version on MPE.

|<img src="http://i.imgur.com/bVVhWYN.png"  width="250" height="150">|<img src="http://i.imgur.com/RLAM80Y.png"  width="250" height="150">|<img src="http://i.imgur.com/3ZYeLYH.png"  width="250" height="150">|
|--|--|--|
|<img src="http://i.imgur.com/W8vQIbl.png"  width="250" height="150">|<img src="http://i.imgur.com/enWaKrM.png"  width="250" height="150">|<img src="http://i.imgur.com/EAXCz6N.png"  width="250" height="150">|
|<img src="http://i.imgur.com/UPRZpqb.png"  width="250" height="150">|<img src="http://i.imgur.com/bELIy0U.png"  width="250" height="150">|<img src="http://i.imgur.com/zHbMsh1.png"  width="250" height="150">|
|JD...|Ctrip,12306...|Restaurants in big cities

I've tracked down an issue that effects the atom and vscode MPE pandoc preview system to the mume library. When these applications use mume during preview to convert a markdown file before sending its contents to pandoc there is a corner case in which mume breaks some ATX-style header labels.

For example when previewing the one line markdown file in MPE:

# My Heading {#sec:mylabel}

mume ignores the label and uses the heading name to create an implicit one:

<p data-line="0" class="sync-line" style="margin:0;"></p>

# My Heading {#my-heading }

This is not a problem when using setext-style headers (that is with underlines). This causes the popular pandoc-crossref filter, which requires section labels to begin with 'sec:', to break.

Sorry for the ticket spam! I created shd101wyy/vscode-markdown-preview-enhanced#1657 with the symptoms and then shd101wyy/vscode-markdown-preview-enhanced#83 once I got closer to the cause.

Hi again @shd101wyy! Just curious what you think of adding .editorconfig file into the root of the project. This file helps different editors behave the same way when it comes to spacing, tabs etc.

In order to avoid a complete reformatting of .vscode/tasks.json when I was editing it, I started .editorconfig locally with the following contents:

[*.json]
indent_size = 4

(otherwise atom was turning four spaces into two on calling beautify)

It'd be great if you could add more rules to the file and commit it – this will express your editing preferences and make it possible for other contributors to follow them with ease!

One thing I'd recommend is adding insert_final_newline = true for all types of files. Otherwise git may report one extra line as modified in a diff when stuff is appended to the end of a file.

Thanks for this powerful markdown engine!

I was trying to adjust the font-size across the page for printing for MPE, and at first, I tried following customized style:

html body {
  font-size: 70%;
}

But it's not working, and I found only pre block was affected. After some digs, I realized many CSS are hardcoded in px, which caused the problem. Now, I used the following customized style as a workaround.

html body {
  // font-size: 70%;
  .markdown-preview{
    p {
      font-size: 0.9em;
      line-height: 1.6em;
    }
  
    h1 {
      font-size: 1.9em;
      line-height: 1.1em;
      code {
        font-size: 0.9em;
      }
    }
    h2 {
      font-size: 1.8em;
      line-height: 1.1em;
      code {
        font-size: 0.9em;
      }
    }
    h3 {
      font-size: 1.2em;
      line-height: 1.1em;
      code {
        font-size: 0.9em;
      }
    }
    h4 {
      font-size: 1.1em;
      line-height: 1.1em;
      code {
        font-size: 0.9em;
      }
    }
    h5 {
      font-size: 1em;
      line-height: 1.1em;
      code {
        font-size: 0.9em;
      }
    }

    code {
      padding: 0.2em;
      font-size: 1em;
    }

    pre[class*="language"] {
      padding: 1em 1.4em;
      font-size: 0.8em;
    }
  }
}

@media print{
  html body {
    font-size: 70%;
  }
}

I found font-size, line-weight and padding are sometimes in px unit, there might be more hardcoded sizes. Could you change the style unit in these theme to em?

I think this is the right repo for the theme style problem for MPE, let me know if I posted to the wrong place.

.mume directory is created in home directory not in .atom directory

When a remote file is referenced in a vega or vega lite spec, the final render may become blank. This is 100% the case when using mume from a command line to generate an html from a markdown. When Atom's preview is used, the probability of a blank render looks correlated with the data file size. Feels like some race condition.

Here is an example: https://vega.github.io/editor/#/examples/vega/annual-temperature

Atom preview

Mume from cli

When an empty cell eg

is rendered, it becomes collapsed making a "wide" column - perhaps intended, but was not expected.