diff --git a/example/app.jsx b/example/app.jsx index 42af756..00e25aa 100644 --- a/example/app.jsx +++ b/example/app.jsx @@ -1,5 +1,3 @@ -/** @jsx React.DOM */ - var React = require("react"); var LinkedStateMixin = require("react/lib/LinkedStateMixin"); @@ -51,4 +49,4 @@ var App = React.createClass({ } }); -React.renderComponent(, document.body); +React.render(, document.body); diff --git a/example/b.jsx b/example/b.jsx index 5f636a1..d0f187b 100644 --- a/example/b.jsx +++ b/example/b.jsx @@ -3,7 +3,6 @@ var React = require("react"); var B = React.createClass({ render: function() { - // Can be changed and updated without full page refresh return

This is component B.

; } }); diff --git a/example/c.jsx b/example/c.jsx index 50df5ce..481bcb2 100644 --- a/example/c.jsx +++ b/example/c.jsx @@ -7,7 +7,6 @@ var C = React.createClass({ return { text: "Text" }; }, render: function() { - // Can be changed and updated without full page refresh return (

This is component C ({this.props.param}).

diff --git a/example/d.jsx b/example/d.jsx index 1f71132..a2900f9 100644 --- a/example/d.jsx +++ b/example/d.jsx @@ -3,7 +3,6 @@ var React = require("react"); var D = React.createClass({ render: function() { - // Can be changed and updated without full page refresh return

This is component D.

; } }); diff --git a/example/webpack.config.js b/example/webpack.config.js index 40def93..b5f2163 100644 --- a/example/webpack.config.js +++ b/example/webpack.config.js @@ -1,8 +1,10 @@ +// Run with "webpack-dev-server --hot --inline --colors" + var path = require("path"); var webpack = require("webpack"); module.exports = { - entry: ["webpack/hot/dev-server", "./app"], + entry: "./app", output: { path: path.join(__dirname, "output"), filename: "bundle.js" diff --git a/index.js b/index.js index f70cf94..7e0dc27 100644 --- a/index.js +++ b/index.js @@ -1,28 +1,23 @@ -var loaderUtils = require("loader-utils"); - module.exports = function() {}; module.exports.pitch = function(remainingRequest) { this.cacheable && this.cacheable(); - var query = loaderUtils.parseQuery(this.query); - var moduleRequest = "!!" + require.resolve("bundle-loader") + "?lazy!" + remainingRequest; + var moduleRequest = "!!" + remainingRequest; return [ 'var React = require("react");', - 'var ReactTextComponent = require("react/lib/ReactTextComponent.js");', + 'var component;', 'var desc = {', ' loadComponent: function(callback) {', - ' var ret;', - ' require(' + JSON.stringify(moduleRequest) + ')(function(component) {', - ' ret = component;', - ' if(callback) callback(component);', - ' });', - ' return ret;', + ' if(!component) {', + ' require.ensure([], function() {', + ' component = require(' + JSON.stringify(moduleRequest) + ');', + ' if(callback) callback(component);', + ' });', + ' } else if(callback) callback(component);', + ' return component;', ' },', - ' _renderUnavailable: function() {', - ' return new ReactTextComponent("");', - ' }', '};', 'var mixinReactProxy = require(' + JSON.stringify(require.resolve("./mixinReactProxy")) + ');', - 'mixinReactProxy(desc);', + 'mixinReactProxy(React, desc);', 'module.exports = React.createClass(desc);', 'module.exports.Mixin = desc;' ].join("\n"); diff --git a/mixinReactProxy.js b/mixinReactProxy.js index 1576365..9f5553d 100644 --- a/mixinReactProxy.js +++ b/mixinReactProxy.js @@ -1,13 +1,13 @@ -module.exports = function(desc) { +module.exports = function(React, desc) { desc.displayName = "ReactProxy"; desc.render = function() { var Component = this.state.component; if(Component) { - return this.transferPropsTo(Component(null, this.props.children)); + return React.createElement(Component, this.props, this.props.children); } else if(this.renderUnavailable) { - return this.renderUnavailable() + return this.renderUnavailable(); } else { - return this._renderUnavailable() + return null; } }; desc.getInitialState = function() { diff --git a/package.json b/package.json index 54192c4..5aa31d1 100644 --- a/package.json +++ b/package.json @@ -7,9 +7,9 @@ "example": "example" }, "devDependencies": { - "react": "^0.10.0", - "jsx-loader": "^0.10.2", - "webpack": "^1.3.1" + "react": "^0.12.0", + "jsx-loader": "^0.12.0", + "webpack": "^1.4.1" }, "scripts": { "test": "mocha -R spec" @@ -30,9 +30,5 @@ "bugs": { "url": "https://github.com/webpack/react-proxy-loader/issues" }, - "homepage": "https://github.com/webpack/react-proxy-loader", - "dependencies": { - "bundle-loader": "^0.5.0", - "loader-utils": "^0.2.3" - } + "homepage": "https://github.com/webpack/react-proxy-loader" }