search

sandros94 / nuxt-markdown-render

A Nuxt wrapper for the popular markdown-it.
https://www.npmjs.com/package/nuxt-markdown-render
MIT License
7 stars 1 forks source link

feat: auto install markdown-it plugins #3

Closed sandros94 closed 7 months ago

sandros94 commented 9 months ago

I wonder if it is possible to look for some sort of registry and auto-install markdown-it plugins from npm.

atinux commented 8 months ago

It would be nice to support https://github.com/antfu/markdown-it-mdc as well by default

sandros94 commented 8 months ago

It would be nice to support https://github.com/antfu/markdown-it-mdc as well by default

Indeed, this was something I had in mind

sandros94 commented 8 months ago

@Atinux, if you have time and will, could I borrow some of your knowledge?

While fixing #2 via https://github.com/Sandros94/nuxt-markdown-render/commit/fe9bea8564af00c51f1f716601ea499c348e8af2, I've came up with the understanding that I required vue.runtimeCompiler = true in nuxt.config.ts.

Is this the only option to make components work? If not, would you please link some resources (or explain them) on what should I study to implement that one better?

Feel free to respond here, or more appropriately in #2 or #4

antfu commented 8 months ago

markdown-it is only responsible for converting markdown to HTML, while if the HTML contains Vue components, I think yes, that would requires runtime compiler

luminarious commented 7 months ago

My setup currently works by having this interesting hook. For anything more efficient I would have to dive deeper into Vite but I don't want to 😅

// nuxt.config.ts
    hooks: {
        'vite:extendConfig': (config, { isClient }) => {
            if (isClient) config.resolve.alias.vue = 'vue/dist/vue.esm-bundler.js'
        }
    },
luminarious commented 7 months ago

To elaborate, I am not returning html, I am returning a render function: https://gist.github.com/luminarious/f55b84e8e0bd56ca39b0e4fa0d91c9f3

sandros94 commented 7 months ago

My setup currently works by having this interesting hook. For anything more efficient I would have to dive deeper into Vite but I don't want to 😅

I would prefer to leave it more agnostic. I was starting to consider a Devtool's panel to help with this, that does fetch the npm packages with the markdown-it-plugin tag, but since the lack of time I might close this for now and revisit it at later date.

To elaborate, I am not returning html, I am returning a render function

Well, that's basically a must 😜