Fixes #223

build.js

@@ -3,6 +3,8 @@ const path = require('path')
 const rollup = require('rollup')
 const babel = require('rollup-plugin-babel')
 const uglify = require('rollup-plugin-uglify')
+const resolve = require('rollup-plugin-node-resolve')
+const commonjs = require('rollup-plugin-commonjs')
 const version = process.env.VERSION || require('./package.json').version
 
 const banner =
@@ -11,52 +13,55 @@ const banner =
  ' * (c) ' + new Date().getFullYear() + ' Awe <hilongjw@gmail.com>\n' +
  ' * Released under the MIT License.\n' +
  ' */\n'
-async function build() {
- try {
- const bundle = await rollup.rollup({
- input: path.resolve(__dirname, 'src/index.js'),
- plugins: [
- babel({ runtimeHelpers: true }),
- uglify()
- ]
- })
-
- let { code } = await bundle.generate({
- format: 'umd',
- name: 'VueLazyload'
- })
-
- code = rewriteVersion(code)
-
- await write(path.resolve(__dirname, 'vue-lazyload.js'), code)
-
- console.log('Vue-Lazyload.js v' + version + ' builded')
- } catch (e) {
- console.log(e)
- }
+
+async function build () {
+ try {
+ const bundle = await rollup.rollup({
+ input: path.resolve(__dirname, 'src/index.js'),
+ plugins: [
+ resolve(),
+ commonjs(),
+ babel({ runtimeHelpers: true }),
+ uglify()
+ ]
+ })
+
+ let { code } = await bundle.generate({
+ format: 'umd',
+ name: 'VueLazyload'
+ })
+
+ code = rewriteVersion(code)
+
+ await write(path.resolve(__dirname, 'vue-lazyload.js'), code)
+
+ console.log('Vue-Lazyload.js v' + version + ' builded')
+ } catch (e) {
+ console.log(e)
+ }
 }
 
-function rewriteVersion(code) {
-  return code.replace('__VUE_LAZYLOAD_VERSION__', version)
+function rewriteVersion (code) {
+ return code.replace('__VUE_LAZYLOAD_VERSION__', version)
 }
 
-function getSize(code) {
-  return (code.length / 1024).toFixed(2) + 'kb'
+function getSize (code) {
+ return (code.length / 1024).toFixed(2) + 'kb'
 }
 
-function blue(str) {
-  return '\x1b[1m\x1b[34m' + str + '\x1b[39m\x1b[22m'
+function blue (str) {
+ return '\x1b[1m\x1b[34m' + str + '\x1b[39m\x1b[22m'
 }
 
-function write(dest, code) {
- return new Promise(function (resolve, reject) {
- code = banner + code
- fs.writeFile(dest, code, function (err) {
- if (err) return reject(err)
- console.log(blue(dest) + ' ' + getSize(code))
- resolve()
- })
+function write (dest, code) {
+ return new Promise(function (resolve, reject) {
+ code = banner + code
+ fs.writeFile(dest, code, function (err) {
+ if (err) return reject(err)
+ console.log(blue(dest) + ' ' + getSize(code))
+ resolve()
  })
+ })
 }
 
 build()

package.json

@@ -1,6 +1,6 @@
 {
  "name": "vue-lazyload",
- "version": "1.2.1",
+ "version": "1.2.2",
  "description": "Vue module for lazy-loading images in your vue.js applications.",
  "main": "vue-lazyload.js",
  "unpkg": "vue-lazyload.js",
@@ -32,6 +32,7 @@
  ],
  "license": "MIT",
  "devDependencies": {
+ "assign-deep": "^0.4.7",
  "babel-cli": "^6.26.0",
  "babel-core": "^6.26.0",
  "babel-plugin-external-helpers": "^6.22.0",
@@ -57,8 +58,8 @@
  "puppeteer": "^0.13.0",
  "rollup": "^0.51.1",
  "rollup-plugin-babel": "^2.6.1",
- "rollup-plugin-commonjs": "^8.2.6",
- "rollup-plugin-node-resolve": "^3.0.2",
+ "rollup-plugin-commonjs": "^8.4.1",
+ "rollup-plugin-node-resolve": "^3.2.0",
  "rollup-plugin-replace": "^2.0.0",
  "rollup-plugin-uglify": "^1.0.1",
  "vue": "^2.5.13"

src/lazy-container.js

@@ -1,7 +1,7 @@
 import {
- assign,
  find,
  remove,
+ assign,
  ArrayFrom
 } from './util'
 
@@ -50,11 +50,14 @@ class LazyContainer {
  update ({ el, binding }) {
  this.el = el
  this.options = assign({}, defaultOptions, binding.value)
+
  const imgs = this.getImgs()
  imgs.forEach(el => {
- this.lazy.add(el, Object.assign({}, this.binding, {
+ this.lazy.add(el, assign({}, this.binding, {
  value: {
- src: el.getAttribute('data-src')
+ src: el.dataset.src,
+ error: el.dataset.error,
+ loading: el.dataset.loading
  }
  }), this.vnode)
  })

src/listener.js

@@ -162,7 +162,7 @@ export default class ReactiveListener {
  imageCache[this.src] = 1
  onFinish()
  }, err => {
- console.error(err)
+ !this.options.silent && console.error(err)
  this.state.error = true
  this.state.loaded = false
  this.render('error', false)

src/util.js

@@ -1,3 +1,5 @@
+import assign from 'assign-deep'
+
 const inBrowser = typeof window !== 'undefined'
 export const hasIntersectionObserver = inBrowser && 'IntersectionObserver' in window
 
@@ -26,16 +28,6 @@ function remove (arr, item) {
  if (index > -1) return arr.splice(index, 1)
 }
 
-function assign (target, source) {
- if (!target || !source) return target || {}
- if (target instanceof Object) {
- for (let key in source) {
- target[key] = source[key]
- }
- }
- return target
-}
-
 function some (arr, fn) {
  let has = false
  for (let i = 0, len = arr.length; i < len; i++) {