diff --git a/LICENSE b/LICENSE new file mode 100644 index 0000000..8c11fc7 --- /dev/null +++ b/LICENSE @@ -0,0 +1,20 @@ +Copyright JS Foundation and other contributors + +Permission is hereby granted, free of charge, to any person obtaining +a copy of this software and associated documentation files (the +'Software'), to deal in the Software without restriction, including +without limitation the rights to use, copy, modify, merge, publish, +distribute, sublicense, and/or sell copies of the Software, and to +permit persons to whom the Software is furnished to do so, subject to +the following conditions: + +The above copyright notice and this permission notice shall be +included in all copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED 'AS IS', WITHOUT WARRANTY OF ANY KIND, +EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF +MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. +IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY +CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, +TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE +SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. diff --git a/README.md b/README.md index 576bbc5..3867cd4 100644 --- a/README.md +++ b/README.md @@ -1,21 +1,33 @@ -# react-proxy-loader - -Wraps a react component in a proxy component to enable Code Splitting (loads a react component and its dependencies on demand). - -## installation - -`npm install react-proxy-loader` +[![npm][npm]][npm-url] +[![deps][deps]][deps-url] +[![chat][chat]][chat-url] + +
+ + + + +

React Proxy Loader

+

Wraps a react component in a proxy component to enable Code Splitting (loads a react component and its dependencies on demand).

+

+ +

Install

+ +```bash +npm install react-proxy-loader` +``` -## Usage +

Usage

[Documentation: Using loaders](http://webpack.github.io/docs/using-loaders.html) ``` js -var Component = require("react-proxy!./Component"); +var Component = require("react-proxy-loader!./Component"); // => returns the proxied component (It loads on demand.) // (webpack creates an additional chunk for this component and its dependencies) -var ComponentProxyMixin = require("react-proxy!./Component").Mixin; +var ComponentProxyMixin = require("react-proxy-loader!./Component").Mixin; // => returns a mixin for the proxied component // (This allows you to setup rendering for the loading state for the proxy) var ComponentProxy = React.createClass({ @@ -28,7 +40,7 @@ var ComponentProxy = React.createClass({ The proxy is a react component. All properties are transferred to the wrapped component. -### Configuration +

Configuration

Instead of (or in addition to) inlining the loader call you can also specify the proxied components in your configuration: @@ -43,7 +55,7 @@ module.exports = { /\.async\.jsx$/, // select component by extension "/abs/path/to/component.jsx" // absolute path to component ], - loader: "react-proxy" + loader: "react-proxy-loader" } ] } @@ -55,9 +67,48 @@ module.exports = { You can give the chunk a name with the `name` query parameter: ``` js -var Component = require("react-proxy?name=chunkName!./Component"); +var Component = require("react-proxy-loader?name=chunkName!./Component"); ``` -# License - -MIT (http://www.opensource.org/licenses/mit-license.php) +

Maintainers

+ + + + + + + + + + +
+ +
+ Juho Vepsäläinen +
+ +
+ Joshua Wiens +
+ +
+ Kees Kluskens +
+ +
+ Sean Larkin +
+ + +[npm]: https://img.shields.io/npm/v/react-proxy-loader.svg +[npm-url]: https://npmjs.com/package/react-proxy-loader + +[deps]: https://david-dm.org/webpack-contrib/react-proxy-loader.svg +[deps-url]: https://david-dm.org/webpack-contrib/react-proxy-loader + +[chat]: https://img.shields.io/badge/gitter-webpack%2Fwebpack-brightgreen.svg +[chat-url]: https://gitter.im/webpack/webpack diff --git a/index.js b/index.js index 4de4f36..a95c5de 100644 --- a/index.js +++ b/index.js @@ -3,7 +3,7 @@ var loaderUtils = require("loader-utils"); module.exports = function() {}; module.exports.pitch = function(remainingRequest) { this.cacheable && this.cacheable(); - var query = loaderUtils.parseQuery(this.query); + var query = loaderUtils.getOptions(this) || {}; var moduleRequest = "!!" + remainingRequest; return [ diff --git a/package.json b/package.json index ce38bfc..fba1140 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "react-proxy-loader", - "version": "0.3.4", + "version": "0.3.5", "description": "Wraps a react component in a proxy component to enable Code Splitting.", "main": "index.js", "directories": { @@ -32,6 +32,6 @@ }, "homepage": "https://github.com/webpack/react-proxy-loader", "dependencies": { - "loader-utils": "~0.2.6" + "loader-utils": "^1.0.2" } }