react-lazyload - npm Package Compare versions

Comparing version 1.3.2 to 1.4.0

lib/index.js

@@ -91,2 +91,6 @@ /**
   var node = _reactDom2['default'].findDOMNode(component);
+  if (!node) {
+    return;
+  }
+
   var parent = _utilsScrollParent2['default'](node);
@@ -242,2 +246,7 @@ var isOverflow = parent !== (node.ownerDocument || document);
 exports['default'] = LazyLoad;
-module.exports = exports['default'];
+
+var _decorator = require('./decorator');
+
+var _decorator2 = _interopRequireDefault(_decorator);
+
+exports.lazyload = _decorator2['default'];

package.json

 {
   "name": "react-lazyload",
-  "version": "1.3.2",
+  "version": "1.4.0",
   "description": "Lazyload your Component, Image or anything matters the performance.",
@@ -5,0 +5,0 @@ "main": "lib/index.js",

README.md

@@ -15,2 +15,3 @@ # react-lazyload [![npm version](https://badge.fury.io/js/react-lazyload.svg)](http://badge.fury.io/js/react-lazyload)
  - IE 8 compatible
+ - Decorator supported
 
@@ -73,2 +74,18 @@ ## Who should use it
 
+If you want to have your component lazyloaded by default, try this handy decorator:
+
+```
+import {lazyload} from 'react-lazyload';
+
+@lazyload({
+  once: true,
+  offset: 100
+})
+class MyComponent extends React.Component {
+  render() {
+    return <div>this component is lazyloaded by default!</div>;
+  }
+}
+```
+
 ## Props
@@ -75,0 +92,0 @@

server.js

@@ -12,4 +12,2 @@ var WebpackDevServer = require('webpack-dev-server');
   noInfo: false,
-  hot: true,
-  lazy: false,
   historyApiFallback: true,
@@ -16,0 +14,0 @@ publicPath: config.output.publicPath,

src/index.js

@@ -75,2 +75,6 @@ /**
   const node = ReactDom.findDOMNode(component);
+  if (!node) {
+    return;
+  }
+
   const parent = scrollParent(node);
@@ -225,1 +229,3 @@ const isOverflow = parent !== (node.ownerDocument || document);
 export default LazyLoad;
+
+export lazyload from './decorator';

webpack.config.js

@@ -17,4 +17,2 @@ 'use strict';
   plugins.push(
-    new webpack.HotModuleReplacementPlugin(),
-    new webpack.NoErrorsPlugin()
   );
@@ -33,19 +31,5 @@ }
 
-var entry = DEV_MODE ? [
-  'webpack-dev-server/client?http://localhost:3000',
-  'webpack/hot/only-dev-server',
-  './examples/app.js'
-] : {
-  app: './examples/app.js',
-  overflow: './examples/overflow.js',
-  scroll: './examples/scroll.js',
-  vendors: ['react']
-};
 
 var loaders = DEV_MODE ? [{
   test: /\.jsx?$/,
-  loader: 'react-hot',
-  exclude: /node_modules/
-}, {
-  test: /\.jsx?$/,
   loader: 'babel?stage=0&loose=all',
@@ -64,6 +48,11 @@ exclude: /node_modules/
 
-  entry: entry,
+  entry: {
+    app: './examples/app.js',
+    overflow: './examples/overflow.js',
+    scroll: './examples/scroll.js',
+    decorator: './examples/decorator.js',
+    vendors: ['react']
+  },
 
   watch: DEV_MODE,
-  debug: DEV_MODE,
   devtool: DEV_MODE ? 'inline-source-map' : 'source-map',
@@ -73,3 +62,4 @@
     path: path.join(__dirname, 'examples/js/'),
-    filename: '[name].js'
+    filename: '[name].js',
+    publicPath: '/js/'
   },
@@ -76,0 +66,0 @@

No alert changes

Improved metrics

Total package byte prevSize

31299

12.31%

Number of package files

17

13.33%

Lines of code

674

9.06%

Number of lines in readme file

154

12.41%

No dependency changes