jonathantneal / posthtml-md

Easily use context-sensitive markdown within HTML
Other
27 stars 4 forks source link

How to pass options to marked.js? #3

Open hvab opened 6 years ago

hvab commented 6 years ago

From gulp example:

...
posthtml([
  require('posthtml-md')({ /* options */ })
])
...

If I pass options, it nothing happened. For example I need code highlight and remove id:

...
posthtml([
  require('posthtml-md')({
        headerIds: false,
        highlight: function(code) {
          return require('highlight.js').highlightAuto(code).value;
        },
      })
])
...

And result without changes.

Vbitz commented 6 years ago

I'm using Parcel and I was able to put

var myMarked = require('marked');

myMarked.setOptions({
    renderer: new myMarked.Renderer(),
    highlight: function(code) {
        return require('highlight.js').highlightAuto(code).value;
    },
    pedantic: false,
    gfm: true,
    tables: true,
    breaks: false,
    sanitize: false,
    smartLists: true,
    smartypants: false,
    xhtml: false
});

before I declared required posthtml-md to set global options.

cossssmin commented 5 years ago

The options passed here:

https://github.com/jonathantneal/posthtml-md/blob/a6f8150f97e5798f15ab914ddf47842117f260e6/index.js#L106

... are not accepted in the default export:

https://github.com/jonathantneal/posthtml-md/blob/a6f8150f97e5798f15ab914ddf47842117f260e6/index.js#L99

... and then marked doesn't use any, either:

https://github.com/jonathantneal/posthtml-md/blob/a6f8150f97e5798f15ab914ddf47842117f260e6/index.js#L45

Now, if you don't have marked as a dependency in your own project, you won't be able to require it like @Vbitz mentioned; instead, you'd need to do something like require('posthtml-md/node_modules/marked')

Even so, the plugin doesn't work as expected: headerIds does nothing, for example.

Also, using GFM fenced code blocks with info strings produces unexpected results:

Input:

```html
<div>some text</div>
```

Output:

<p><code>`</code>html</p>
<div><p>some text</p></div>

Even not specifying the info string, but using HTML inside the fenced code block:

```
<div>some text</div>
```

... produces:

<p><code>`</code></p>
<div><p>some text</p></div>
OzymandiasTheGreat commented 5 years ago

So I submitted a pull request to actually pass options to marked, but after checking out the code I can say this plugin will break again and again and maintenance will be a pain in the behind.

I put together a simpler code-wise alternative yesterday, but I did it in a single afternoon and didn't do much more than basic testing so it may be buggy. Still it fixes all the issues mentioned in this thread, so you may want to check it out. I just published it to npm.