search

nuxt / content

The file-based CMS for your Nuxt application, powered by Markdown and Vue components.
https://content.nuxt.com
MIT License
3.15k stars 630 forks source link

Support for @nuxt/image #624

Open giticon opened 4 years ago

giticon commented 4 years ago

Support for @nuxt/image

atinux commented 4 years ago

It is planned :)

ay13 commented 3 years ago

Is there an update on this issue?

atinux commented 3 years ago

No yet sorry, lot of work regarding the alpha of Nuxt 3 coming.

narduin commented 3 years ago

I don't know if it's officially supported but it currently works with one little "hack". When using <nuxt-img/> inside a markdown nuxt-content file, everything after the image is not rendered (don't know why).

<!-- doesn't work -->
<nuxt-img
    src="https://"
    sizes="sm:100vw xl:728px"
    width="728"
    height="412"
    loading="lazy"
/>

But explicitly closing the tag works:

<!-- works -->
<nuxt-img
    src="https://"
    sizes="sm:100vw xl:728px"
    width="728"
    height="412"
    loading="lazy">
</nuxt-img>
nozomuikuta commented 3 years ago

@narduin

It's written in documentation that:

Since @nuxt/content operates under the assumption all Markdown is provided by the author (and not via third-party user submission), sources are processed in full (tags included), with a couple of caveats from rehype-raw: ...

  1. You cannot use self-closing tags, i.e., this won't work:
narduin commented 3 years ago

It's written in documentation that:

I didn't know that! So I guess nuxt-image is now supported inside of nuxt-content 😃

atinux commented 2 years ago

Linking to https://github.com/nuxt/image/issues/500

Once Nuxt Image supports Nuxt 3, we will be able to work on it for Content V2.

itpropro commented 2 years ago

@Atinux nuxt/image compatibility with Nuxt 3 started a while ago, when do you think we can expect nuxt/content integration or should it just work right now by adding the module?

atinux commented 2 years ago

If you can try on your project and give me back feedback on it it would be great @itpropro, don't have the time right now to check.

Our main focus is 3.0 stable release before finishing our official modules

itpropro commented 2 years ago

The current version of Nuxt/Content (created wiht pnpm dlx nuxi init content-app -t content) doesn't start at all anymore, as soon as Content works again, I can create a repo repository for Nuxt/Image @Atinux

atinux commented 2 years ago

It works for me and in Sandbox: https://stackblitz.com/github/nuxt/starter/tree/content

itpropro commented 2 years ago

My mistake, I created for pnpm and was expecting to not need to specify --shamefully-hoist, overlooked that in the documentation. Maybe we can add a .npmrc file with shamefully-hoist=true to the project when using pnpm dlx to bootstrap. I will test the nuxt/image module with some configs from another project and provide feedback here.

tex0l commented 1 year ago

Hi! I have tried on nuxt@3.0.0, @nuxt/content@2.2.2 and @nuxt/image-edge@1.0.0-27827328.bc9ddc0, it doesn't work with :nuxt-img{src="/path/to/my/img"}, the components isn't found.

tex0l commented 1 year ago

see https://github.com/nuxt/content/issues/390#issuecomment-1267292231

hartmut-co-uk commented 1 year ago

see solution for current edge version (tested with @nuxt/image-edge:1.0.0-27821548.ab054e4) provided here: https://github.com/nuxt/content/issues/390#issuecomment-1344593577

giticon commented 1 year ago

Hi! I have tried on nuxt@3.0.0, @nuxt/content@2.2.2 and @nuxt/image-edge@1.0.0-27827328.bc9ddc0, it doesn't work with :nuxt-img{src="/path/to/my/img"}, the components isn't found.

Try this <nuxt-img :src="path_img" />

tex0l commented 1 year ago

Hi! I have tried on nuxt@3.0.0, @nuxt/content@2.2.2 and @nuxt/image-edge@1.0.0-27827328.bc9ddc0, it doesn't work with :nuxt-img{src="/path/to/my/img"}, the components isn't found.

Try this <nuxt-img :src="path_img" />

No it doesn't work.

However this works: https://github.com/nuxt/content/issues/390#issuecomment-1344593577