Hacker News new | past | comments | ask | show | jobs | submit login
Convert Markdown to PDF only using browser (netlify.com)
118 points by realdennis 29 days ago | hide | past | web | favorite | 30 comments

Similar topics are coming up often on HN recently. I think it's time Markdown should be supported natively by browsers. Until then, there are things like:

TeXMe (https://github.com/susam/texme): This is my personal favorite because it supports the CommonMark standard of Markdown and also LaTeX via MathJax. I like standards so that I know that the Markdown I write (especially nested lists, code within nested lists, etc.) get rendered the same way everywhere. I write some math too, so MathJax support is useful. If you are looking for something where you can just slap together Markdown and LaTeX and turn the document instantly into a paper-like finish, this is a good choice. The output can be saved as PDF or printed too just like you would print any paper.

MdMe (https://github.com/susam/mdme): This is pretty much TeXMe without MathJax support.

Markdeep (https://casual-effects.com/markdeep/): This is like TeXMe but it supports a lot of features like diagrams, tables, etc. But it comes at the cost of standard conformance. Markdeep does not conform to CommonMark. I don't need these additional features for most of my writing but I care about standard conformance, so I go with TeXMe but if you need these features then Markdeep is a good choice.

Comparison of TeXMe vs. Markdeep by the author: https://news.ycombinator.com/item?id=18314175

> I think it's time Markdown should be supported natively by browsers.

I'd rather have AsciiDoc become the default lightweight documentation format. Markdown suffers from competing standards regarding extensibility beyond basic formating, whereas AsciiDoc is a quite direct translation of the solid standard Docbook.

Extending Markdown to anything more complex than bold, italic or headers requires deciding among a number of competing tools with different syntax and installing them as extensions. AsciiDoc has features as tables, references, images or metadata integrated in the standard, and it has been designed for extensibility, while Markdown was not.

There is an advantage of using Markdown over AsciiDoc, which is that it is currently supported by a larger variety of tools. But that advantage is somewhat negated by its different and slightly incompatible flavors.



Does AsciiDoc have a nice way to ignore all LaTeX code enclosed within $...$ (inline math), $$...$$ (displayed math), \(...\) (inline math), and \[...\] (displayed math)?

I think one of the problems of Markdown is that it does not provide a way for the Markdown parser to ignore any text within certain delimiters (I especially care about ignoring text within Latex math delimiters). This is the most crucial reason why I am using tools like TexMe or Markdeep.

Is AsciiDoc better in this area? If yes, it would definitely solve a big problem for me that Markdown does not solve.

AFAIK there are several ways to embed LaTeX and mathematical formulas in AsciiDoc such as asciidoctor-latex [1] or ASCIIMathML and LaTeXMathML [2].

AsciiDoc also allows embedding literal paragraphs or blocks of text [3]. I think the mechanism of passthrough macros [4] can be used to copy raw text to the output and allow further processing down the pipeline, though I'm not sure how it's used.

[1] https://github.com/asciidoctor/asciidoctor-latex

[2] http://asciidoc.org/#X3

[3] http://asciidoc.org/userguide.html#X76

[4] http://asciidoc.org/userguide.html#X77

I've only skimmed over the links you provided so far, but why do we even need any of this stuff?

Look at this recent show HN: https://news.ycombinator.com/item?id=19482280

It's plain text, would parse as valid Markdown for the most part but reads just fine - I didn't even realize that it was MD until someone mentioned it in the comments. Using

  Underlined Text
  Works as an effective heading (# in MD)
  Leaving some empty lines also helped in that txt file
  * and these
    * type of lists
  * work just fine.
Why not just use a .txt file with two or three special format codes: one to make a URL clickable, one to embed an image (with a specified width, clicking goes to the full image), and (maybe? - this is getting kinda complex) one for math.

On the one hand there are barebones formats like what I described, and on the other there are complex ones like MD and the ones you linked to. The issue with all of the complex ones is that they provide leaky abstractions.

With MD you get a compiler that does MD->HTML, and you provide your own CSS file. OK, now you have a neat looking table. But what if you want to make a cell span two columns? You're screwed, you either need to look up complex nonstandard syntax for that (may as well use HTML at that point) or just convert the whole table into HTML (now you have 80% MD and 20% HTML in your file).

But if you have a .txt file, you just delete the | pipes you drew. Sure it's a bit more tedious, but it works and is 100% consistent.

And what if your CSS gives table header rows a yellow background, but you want one column of a specific table to be red? Again you need nonstandard syntax to mark that table with a class and link it to a CSS rule, or you just convert the whole thing to HTML and add an inline color="...". Leaky abstraction.

In this case a .txt helps by removing choice and placing limitations - you can format the whole document as a text file but with clickable links and inline images, and if you need more styling then you can use HTML. Or write in MD and compile into HTML, if that's what you want.

MD and its other formats are in a half-between position where you often use the abstraction but also occasionally have to fall down to the lower HTML level, and I just don't think that it deserves a place as a standard format for web browsers.

> I think it's time Markdown should be supported natively by browsers.

Will never happen b/c markdown can't be bloated with MBs of javascript.


See also markdeep[1] (extension of markdown) and remarkable[2] (desktop app)

Personally, I use pandoc and customize using xelatex [3] to generate beautiful pdfs for self publishing

[1] https://casual-effects.com/markdeep/

[2] https://remarkableapp.github.io/linux.html

[3] https://learnbyexample.github.io/tutorial/ebook-generation/c...

Pandoc is definitely the way to go. Very easy to automate, too.

Seriously, this is just `window.print()`...

You weren't kidding!


     function() {
         return window.print()
Though the codemirror stuff is probably a bit more work.

Yeah, the project is basically a React app that implements the plumbing for the editor vs preview panes, file selection, and the drag-n-drop file handler.

Nothing wrong with that, but a project named "md2pdf" juxtaposed with onClick={window.print} is unexpected.

The first problem I want to solve was that convert MD file to PDF.

And I found the powerful way was browser print. It allows you zoom rate/choose page range.

So, I dig in CSS media query and try to compatible cross browser(Chrome&FF).

I made an editor in left side just cause sometimes we want edit some typo or something before convert...haha, codemirror makes a good user experience than textarea.

Yeah, that technically works ;)

I was kind of expecting that the PDF generation is done with some script like https://github.com/mrrio/jspdf and then rendered with https://github.com/mozilla/pdf.js :)

Small preference would be for the edits on the left side to be saved in local storage for the next visit similar to dillinger.io

do you know if there is a way to remove the datetime stamp header that is inserted into the pdf when printing?

Once Chrome's print dialog pops up, you can expand "More settings" and then uncheck "Headers and footers".

thanks, worth noting that the print dialog does not support that option when using Firefox on Windows

I think you need to open it in Print Preview to change those settings, which is accessible in the main menu (there's not a keyboard shortcut, unfortunately).

I have the same thing as dirty Python script[1]. Handy to send notes or reports to clients as "nice" PDF.

One could customize it to support additional markdown features, like footnotes, tables. To run:

$ md2pdf some-markdown.md # gives some-markdown.pdf

You can also pass a CSS sheet with some custom fonts and colors. (sample included with GIST)

$ export MD2PDF_CSS=style.css md2pdf myfile.md

1: https://gist.github.com/m3nu/616c0d59246d0554ed599daeec44e64...

I also prefer local solutions, try e.g.

    aptitude show python-markdown
It might feel cool just maximize use of your browser, but I shy from putting this kind of (possibly confidential) content via internet based solutions/services.

I wish there would be an open source alternative to PrinceXML.

Me too. It’s a nice project, but expensive for small projects.

I really wish there was just a better alternative to pdf that lets me “print” a single pretty file that has everything a reader needs.

My dream is that Microsoft finally buys adobe and becomes a saint by making a full oss pdf implementation that includes a wide variety of language libs.

It will cost a lot but further differentiate then from google and amazon similar to buying github and not screwing it up (hopefully).

I did find this today:


Seems like the closest open source alternative to PrinceXML.

Thanks will take a look, up to now everything else I've tried had subpar print CSS support and created not the best output. Didn't know weasyprint !

[Edit] Tried out Weasyprint, sadly doesn't support a lot of stuff which I need (Javascript, could hack phantomjs, and CSS leader() for TOCs).

Visual Studio Code "Markdown PDF" addon is perfect for this type of job.


I've been using the Markdown Reader Chrome extension and using the browser print function to do this kind of conversion.

What would be really useful (to me personally) is a tool that renders plantUML/mermaid embedded into markdown to a PDF. I haven't been able to find a simple solution that doesn't require writing code to integrate the libraries together, or rendering the images separately and bringing them into the markdown document (which is tedious).

check out markdeep[1] which allows diagrams (but I don't think it is comprehensive like plantUML/mermaid)

[1] https://casual-effects.com/markdeep/

There is a filter for Pandoc that lets you embed PlantUML.


I too can "print to PDF."

Just FYI, this is being blocked by Cisco Umbrella

Guidelines | FAQ | Support | API | Security | Lists | Bookmarklet | Legal | Apply to YC | Contact