Skip to content

Instantly share code, notes, and snippets.

@eirikb
Last active June 8, 2016 10:07
Show Gist options
  • Save eirikb/f409409ef79bc25314d8 to your computer and use it in GitHub Desktop.
Save eirikb/f409409ef79bc25314d8 to your computer and use it in GitHub Desktop.
  1. Download zip.
  2. npm install.
  3. npm start.
import React from 'react';
import ReactDOM from 'react-dom';
import Test from './test';
ReactDOM.render(React.createElement(Test), document.getElementById('app'));
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JSPM + React + hotreload</title>
</head>
<body>
<div id="app"></div>
<script src="jspm_packages/system.js"></script>
<script src="config.js"></script>
<script>
System.trace = true;
System.import('capaj/systemjs-hot-reloader').then(function (HotReloader) {
new HotReloader.default('http://localhost:5776');
}).then(function () {
System.import('app');
});
</script>
</body>
</html>
{
"name": "demo",
"version": "1.0.0",
"main": "index.js",
"devDependencies": {
"chokidar-socket-emitter": "^0.4.2",
"http-server": "^0.8.5",
"jspm": "^0.16.26",
"npm-run-all": "^1.5.1"
},
"jspm": {
"dependencies": {
"capaj/systemjs-hot-reloader": "github:capaj/systemjs-hot-reloader@^0.5.5",
"react": "npm:react@^0.14.7",
"react-dom": "npm:react-dom@^0.14.7"
},
"devDependencies": {
"babel": "npm:babel-core@^5.8.24",
"babel-runtime": "npm:babel-runtime@^5.8.24",
"core-js": "npm:core-js@^1.1.4"
}
},
"scripts": {
"postinstall": "jspm i -y",
"server": "http-server -c-1 -o",
"hotreload": "chokidar-socket-emitter",
"start": "npm-run-all --parallel server hotreload"
}
}
import React from 'react';
class Test extends React.Component {
constructor() {
super();
this.state = {
text: 'World'
};
}
render() {
return <p>Hello, {this.state.text}!</p>;
}
}
export default Test;
@kwesterfeld
Copy link

I have been using this and adapting for my app. I found that if you add -c-1 to http-server you don't have to muck with the browser cache. I think you should add that to http-server.

I also use http-server --proxy to send REST requests to my back end. It's almost working perfectly now!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment