begin with : jspm-angular4-seed
$ git clone git@github.com:thatseeyou/angular-examples.git $ cd angular-examples $ npm install $ jspm install $ npm run build:watch $ npm run serve proj> jspm install npm:angularfire2 ... "firebase": ["jspm_packages/npm/firebase@4.3.0"], "firebase/*": ["jspm_packages/npm/firebase@4.3.0/*"], "angularfire2": ["jspm_packages/npm/angularfire2@4.0.0-rc.2"], "angularfire2/*": ["jspm_packages/npm/angularfire2@4.0.0-rc.2/*"], ... ... "src-firebase/app": { "defaultExtension": "js", "meta": { "./*.js": { "loader": "systemjs-angular-loader.js" } }, "map": { "angularfire2/database": "npm:angularfire2@4.0.0-rc.2/bundles/database.umd.js", "angularfire2/auth": "npm:angularfire2@4.0.0-rc.2/bundles/auth.umd.js" } } ... ... { path: 'toh.html', redirectTo: '/dashboard', pathMatch: 'full' }, ... To support multiple SPA on one lite-server, bs-config.js/middleware/rewrites setting is used.
module.exports = { browser: "firefox", server: { baseDir: "src", routes: { "/jspm_packages": "jspm_packages" }, middleware: { // overrides the second middleware default with new settings // refer: https://github.com/bripkens/connect-history-api-fallback 1: require('connect-history-api-fallback')({ index: '/index.html', htmlAcceptHeaders: ['text/html', 'application/xhtml+xml'], // change HTML : <base href="/toh"> rewrites: [ { from: /\/hello.*/, to: '/hello.html' }, { from: /\/toh.*/, to: '/toh.html' } ], verbose: false }) } } }; proj> jspm install npm:angular-in-memory-web-api -o '{ "peerDependencies": [] }' ↳ override package.json to prevent jspm from installing another @angular version. ... "angular-in-memory-web-api": ["jspm_packages/npm/angular-in-memory-web-api@0.3.2"], ...