fix: do not render image without src

nuxt · Nov 10, 2020 · cbeada1 · cbeada1
1 parent 68863f9
commit cbeada1
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 28 deletions.
diff --git a/src/runtime/nuxt-image.ts b/src/runtime/nuxt-image.ts
@@ -66,33 +66,33 @@ export default {
       })
     }
 
-    const originalImage = h('img', {
-      class: '__nim_o',
-      style: {
-        position: 'absolute',
-        left: 0,
-        top: 0,
-        margin: 0,
-        width: '100%',
-        height: '100%',
-        objectFit: 'cover',
-        objectPosition: 'center center',
-        transition: 'opacity 800ms ease 0ms',
-        opacity: 0,
-        ...(this.lazyState === LazyState.LOADED ? {
-          opacity: 1
-        } : {})
-      },
-      attrs: {
-        src: this.lazyState !== LazyState.IDLE ? this.generatedSrc : undefined,
-        srcset: this.lazyState !== LazyState.IDLE ? this.generatedSrcset : undefined,
-        sizes: this.lazyState !== LazyState.IDLE ? this.generatedSizes : undefined,
-        ...this.imgAttributes
-      },
-      on: {
-        load: this.onImageLoaded
-      }
-    })
+    let originalImage = null
+    if (this.lazyState !== LazyState.IDLE) {
+      originalImage = h('img', {
+        class: '__nim_o',
+        style: {
+          position: 'absolute',
+          left: 0,
+          top: 0,
+          margin: 0,
+          width: '100%',
+          height: '100%',
+          objectFit: 'cover',
+          objectPosition: 'center center',
+          transition: 'opacity 800ms ease 0ms',
+          opacity: this.lazyState === LazyState.LOADED ? 1 : 0
+        },
+        attrs: {
+          src: this.generatedSrc,
+          srcset: this.generatedSrcset,
+          sizes: this.generatedSizes,
+          ...this.imgAttributes
+        },
+        on: {
+          load: this.onImageLoaded
+        }
+      })
+    }
 
     let noScript = null
     if (this.noScript) {

diff --git a/src/runtime/nuxt-picture.ts b/src/runtime/nuxt-picture.ts
@@ -96,7 +96,7 @@ export default {
       })
     }
 
-    const picture = h('picture', {}, [
+    const picture = this.lazyState === LazyState.IDLE ? null : h('picture', {}, [
       ...sources,
       originalImage
     ])