capaj / jspm-react

lightweight React.js ES6 boilerplate with JSPM and proper hot reloading modules

jspm-react DEPRECATED

This repo is deprecated-other bundlers have won the bundler wars-namely webpack or parcel. Use them instead.

lightweight React.js boilerplate with JSPM and hot reloading modules

master branch has JSPM 0.16, for 0.17 use branch jspm-0.17. JSPM 0.17 is still beta, I would advise against using JSPM 0.17 for production deployments for now.

Quickstart to development

git clone [email protected]:capaj/jspm-react.git
npm i
npm start

npm scripts available:

npm start #starts webserver and watcher, the http port is 9080
npm build #build your bundle, use purely for production
npm test #runs mocha/chai/jsdom tests in node.js

Styles

Make your own style pipeline, this boilerplate doesn't offer one. Me personally, I am fine with inline styles inside my react components most of the time, but that is just me.

Includes

• githooks via husky for commit trigerring tests and style check
• MobX for easy/reliable/fast state management powered by ES5 getters/setters
• react-router
• simple unit/midway tests with Mocha, Chai and airbnb's enzyme

jspm-react's Issues

Uncaught error in hot reloader setup

I did

npm i
npm start

Visit localhost:9080

localhost/:1 Uncaught (in promise) Error: Super expression must either be null or a function, not object
    Error loading http://localhost:9080/jspm_packages/github/capaj/[email protected]
    at exports.default (http://localhost:9080/jspm_packages/npm/[email protected]/helpers/inherits.js:7:11)
    at http://localhost:9080/jspm_packages/github/capaj/[email protected]/hot-reloader.js!transpiled:35:9
    at execute (http://localhost:9080/jspm_packages/github/capaj/[email protected]/hot-reloader.js!transpiled:271:9)
    at u (http://localhost:9080/jspm_packages/system.js:5:2888)
    at u (http://localhost:9080/jspm_packages/system.js:5:2823)
    at Object.execute (http://localhost:9080/jspm_packages/system.js:5:5888)
    at y (http://localhost:9080/jspm_packages/system.js:4:10168)
    at x (http://localhost:9080/jspm_packages/system.js:4:10547)
    at p (http://localhost:9080/jspm_packages/system.js:4:8425)
    at h (http://localhost:9080/jspm_packages/system.js:4:8810)

My local node version is 5.4.1 npm is 3.3.12, jspm is 0.16.23

Can't build

$ npm run build

> [email protected] build /Users/administrator/Projects/jspm-react
> jspm bundle app --inject --minify

     Building the bundle tree for app...

err  Error on fetch for npm:[email protected]/lib/es5.js at file:///Users/administrator/Projects/jspm-react/public/jspm_packages/npm/[email protected]/lib/es5.js
    Loading npm:[email protected]/lib/memoizer.js
    Loading npm:[email protected]/index.js
    Loading npm:[email protected]
    Loading npm:[email protected]/lib/index.js
    Loading npm:[email protected]
    Loading app.js
    Error: ENOENT: no such file or directory, open '/Users/administrator/Projects/jspm-react/public/jspm_packages/npm/[email protected]/lib/es5.js.map'
         at Error (native)

npm ERR! Darwin 14.5.0
npm ERR! argv "/Users/administrator/.nvm/versions/node/v5.1.0/bin/node" "/Users/administrator/.nvm/versions/node/v5.1.0/bin/npm" "run" "build"
npm ERR! node v5.1.0
npm ERR! npm  v3.3.12
npm ERR! code ELIFECYCLE
npm ERR! [email protected] build: `jspm bundle app --inject --minify`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] build script 'jspm bundle app --inject --minify'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the react-app package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     jspm bundle app --inject --minify
npm ERR! You can get their info via:
npm ERR!     npm owner ls react-app
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     /Users/administrator/Projects/jspm-react/npm-debug.log

Weakee dependency possible ES6 export issue

I'm getting the following error when trying to run the project (after having followed the install instructions)

Potentially unhandled rejection [2] TypeError: Error evaluating github:capaj/[email protected]/jspm-hot-reloader
Super expression must either be null or a function, not undefined
    at exports.default (http://localhost:9080/jspm_packages/npm/[email protected]/helpers/inherits.js:7:11)
    at eval (http://localhost:9080/jspm_packages/github/capaj/[email protected]/jspm-hot-reloader.js!eval:28:9)
    at System.register._export.execute (http://localhost:9080/jspm_packages/github/capaj/[email protected]/jspm-hot-reloader.js!eval:180:9)
    at t (http://localhost:9080/jspm_packages/es6-module-loader.js:7:19798)
    at v (http://localhost:9080/jspm_packages/es6-module-loader.js:7:20180)
    at v (http://localhost:9080/jspm_packages/es6-module-loader.js:7:20027)
    at u (http://localhost:9080/jspm_packages/es6-module-loader.js:7:19856)
    at s (http://localhost:9080/jspm_packages/es6-module-loader.js:7:19737)
    at http://localhost:9080/jspm_packages/es6-module-loader.js:7:22064
    at O (http://localhost:9080/jspm_packages/es6-module-loader.js:7:7439)

There seems to be something up with the way the weakee dependency is being exported that's causing the inherits module to fail where it does.

Any help would be much appreciated.

Warning about router in console

When I run this as-is in Chrome I get this in the console:

Warning: You cannot change <Router routes>; it will be ignored

It seems to work anyway but would be nice to get rid of the warning.

decorators

have you had any luck getting the decorators to work?

Dependency duplication

Hey thanks for a great repo, it's very nice! Only one thing bugs me a bit. The dependencies are duplicated, one has to install same libraries in node_modules and jspm_packages. It's not a huge problem but it would be more elegant to be able to use jspm everywhere, also in testing. Do you have idea how this could be solved?

This thing could also introduce issues, in this case for example I can see that you have a different version of react in node_modules and in jspm_packages .

local installation of jspm, upgrade to jspm 0.17

I had issues with postinstall because it seems like jspm must be installed globally.

Upgraded the repo to be 0.17 conformant, I could make a pull request if that would be useful!

Awesome repo!