These are chat archives for systemjs/systemjs

16th
Jun 2015
Maeoll Kim
@abyss-outpost
Jun 16 2015 03:28
so i'm using SystemJS to optionally load javascript files but It's not working... should I do angular.pausebootstrap() and then do resumeboostrap() or how do I load more controllers after the initial app has been boostrapped?
Robert Baker
@robertbaker
Jun 16 2015 05:22
I just updated to the beta. I'm using typescript master. es6 loader is gone. what should go in my index now??
Guy Bedford
@guybedford
Jun 16 2015 16:33
@/all a small breaking correction to SystemJS 0.17, 0.18 has been released - https://github.com/systemjs/systemjs/releases/tag/0.18.0
Robert Baker
@robertbaker
Jun 16 2015 16:57
@guybedford I'm using jspm beta and systemjs .18. It doesn't seem to be loading. Using typescript master.
<script src="jspm_packages/system.js"></script>
<script>
    System.config({
        "baseURL": "/app",
        "transpiler": "typescript",
        typescriptOptions: {
            "module": "system",
            "removeComments": true,
            "sourceMap": true,
            "target": "ES5",
            "experimentalDecorators": true
        }
    });
    System.import('boot.js');
</script>
no console error messages, but it's not loading. In my boot file I have a console.log to verify
I know it's loading system.js though
Mike Joyce
@MikeJoyce19
Jun 16 2015 19:22
"paths": { "*": "*.js", "github:*": "../jspm_packages/github/*.js", "npm:*": "../jspm_packages/npm/*.js" },
COuld someone explain the purpose of "paths" in System.config?
I'm using the skeleton project https://github.com/lookfirst/systemjs-seed/
Are these simply shortcut paths that are used in the map config value, e.g. "angular": "github:angular/bower-angular@1.3.15"
PeterKnight
@PeterKnight
Jun 16 2015 19:51
Where's the best place to ask a how-to question? I'm trying to figure out how to setup a workflow where I can switch between a bundled and unbundled setup seamlessly. I also am trying to figure out how to run separate instances of System with their own config files on the same page. Don't know what the ideal way of setting that up is... any pointers or examples?
Eric Eastwood
@MadLittleMods
Jun 16 2015 20:39
@PeterKnight I use the jspm API and a gulp task. gulp --dev unbundles everything and gulp for fully injected bundle
Guy Bedford
@guybedford
Jun 16 2015 21:15
@PeterKnight for separate System instances you can create new instances of the SystemJS base class - https://github.com/systemjs/systemjs/blob/master/docs/system-api.md#systemconstructor
Robert Baker
@robertbaker
Jun 16 2015 21:41
@guybedford little help?
Guy Bedford
@guybedford
Jun 16 2015 21:43
@robertbaker how did you install typescript master?
Robert Baker
@robertbaker
Jun 16 2015 21:44
npm -i -g Microsoft/Typescript and npm i Microsoft/Typescript. jspm installed typescript 1.5.2 when I did the system.config
Guy Bedford
@guybedford
Jun 16 2015 21:45
you need to install the transpiler via jspm
yeah so it installs that one for you
Is there a reason you haven't included the standard jspm config file config.js with a script tag in the example?
doesn't say I need a config.js
@guybedford how should I install typescript into jspm? jspm install typescript ? points to mhegazy
PeterKnight
@PeterKnight
Jun 16 2015 22:12
@MadLittleMods Thank you for that example!
PeterKnight
@PeterKnight
Jun 16 2015 22:37
@guybedford When I create a new instance with System.constructor I get
(es6-module-loader@0.16.6.src.js:2193 Uncaught TypeError: Options must be an object(…))
Guy Bedford
@guybedford
Jun 16 2015 22:53
@robertbaker my apologies, sorry thought you were using jspm. You basically need to set up a path to TypeScript's main file - System.config({ paths: { typescript: 'path/to/typescript.js' } })
alternatively you can include it manually with a script tag at the top of the page
@PeterKnight the example was for SystemJS@0.18, for SystemJS@0.16 there is System.clone which was deprecated
Robert Baker
@robertbaker
Jun 16 2015 22:53
@guybedford I am using jspm. I'm converting my project from bower to jspm. I'm using TS. I already did the es6 style imports.
Guy Bedford
@guybedford
Jun 16 2015 22:54
right, then for jspm you need to include the config.js file always
Robert Baker
@robertbaker
Jun 16 2015 22:55
@guybedford I put my config js both inline script and a ref.
System.config({
  "baseURL": "/app",
  "defaultJSExtensions": true,
  "transpiler": "typescript",
  "typescriptOptions": {
    "module": "system",
    "removeComments": true,
    "sourceMap": true,
    "target": "ES5",
    "experimentalDecorators": true
  },
  "paths": {
    "github:*": "jspm_packages/github/*",
    "npm:*": "jspm_packages/npm/*"
  }
});

System.config({
  "map": {
    "TheRusskiy/ng-slide-down": "github:TheRusskiy/ng-slide-down@0.4.1",
    "adjohnson916/ng-click-select": "github:adjohnson916/ng-click-select@0.1.4",
    "angular": "github:angular/bower-angular@1.4.1",
    "angular-animate": "github:angular/bower-angular-animate@1.4.1",
    "angular-material": "github:angular/bower-material@master",
    "angular-messages": "github:angular/bower-angular-messages@1.4.1",
    "angular-moment": "npm:angular-moment@0.10.1",
    "angular-numbro": "npm:angular-numbro@1.2.2",
    "angular-timeago": "npm:angular-timeago@0.1.12",
    "angular-ui-router": "npm:angular-ui-router@0.2.15",
    "babel": "npm:babel-core@5.5.8",
    "babel-runtime": "npm:babel-runtime@5.5.8",
    "core-js": "npm:core-js@0.9.17",
    "ng-click-select": "github:adjohnson916/ng-click-select@0.1.4",
    "ng-decorate": "npm:ng-decorate@0.0.12",
    "ng-fittext": "npm:ng-fittext@3.3.3",
    "ng-slide-down": "github:TheRusskiy/ng-slide-down@0.4.1",
    "patrickmarabeas/ng-FitText.js": "github:patrickmarabeas/ng-FitText.js@3.3.3",
    "phoneformat": "npm:phoneformat@0.0.7",
    "traceur": "github:jmcriffey/bower-traceur@0.0.88",
    "traceur-runtime": "github:jmcriffey/bower-traceur-runtime@0.0.88",
    "typescript": "github:mhegazy/typescript@v1.5-beta2",
    "typescript-runtime": "npm:babel-runtime@5.5.8",
    "github:angular/bower-angular-animate@1.4.1": {
      "angular": "github:angular/bower-angular@1.4.1"
    },
    "github:angular/bower-angular-aria@1.4.1": {
      "angular": "github:angular/bower-angular@1.4.1"
    },
    "github:angular/bower-material@master": {
      "angular": "github:angular/bower-angular@1.4.1",
      "angular-animate": "github:angular/bower-angular-animate@1.4.1",
      "angular-aria": "github:angular/bower-angular-aria@1.4.1",
      "css": "github:systemjs/plugin-css@0.1.12"
    },
    "github:jspm/nodelibs-assert@0.1.0": {
      "assert": "npm:assert@1.3.0"
    },
    "github:jspm/nodelibs-buffer@0.1.0": {
      "buffer": "npm:buffer@3.2.2"
    },
    "github:jspm/nodelibs-events@0.1.1": {
      "events": "npm:events@1.0.2"
    },
    "github:jspm/nodelibs-http@1.7.1": {
      "Base64": "npm:Base64@0.2.1",
      "events": "github:jspm/nodelibs-events@0.1.1",
      "inherits": "npm:inherits@2.0.1",
      "stream": "github:jspm/nodelibs-stream@0.1.0",
      "url": "github:jspm/nodelibs-url@0.1.0",
      "util": "github:jspm/nodelibs-util@0.1.0"
    },
    "github:jspm/nodelibs-https@0.1.0": {
      "https-browserify": "npm:https-browserify@0.0.0"
    },
    "github:jspm/nodelibs-os@0.1.0": {
      "os-browserify": "npm:os-browserify@0.1.2"
    },
    "github:jspm/nodelibs-path@0.1.0": {
      "path-browserify": "npm:path-browserify@0.0.0"
    },
    "github:jspm/nodelibs-process@0.1.1": {
      "process": "npm:process@0.10.1"
    },
    "github:jspm/nodelibs-stream@0.1.0": {
      "stream-browserify": "npm:stream-browserify@1.0.0"
    },
    "github:jspm/nodelibs-url@0.1.0": {
      "url": "npm:url@0.10.3"
    },
    "github:jspm/nodelibs-util@0.1.0": {
      "util": "npm:util@0.10.3"
    },
    "github:systemjs/plugin-css@0.1.12": {
      "clean-css": "npm:clean-css@3.1.9",
      "fs": "github:jspm/nodelibs-fs@0.1.2",
      "path": "github:jspm/nodelibs-path@0.1.0"
    },
    "npm:amdefine@0.1.1": {
      "fs": "github:jspm/nodelibs-fs@0.1.2",
      "module": "github:jspm/nodelibs-module@0.1.0",
      "path": "github:jspm/nodelibs-path@0.1.0",
      "process": "github:jspm/nodelibs-process@0.1.1"
    },
    "npm:angular-moment@0.10.1": {
      "moment": "npm:moment@2.10.3",
      "process": "github:jspm/nodelibs-process@0.1.1"
    },
    "npm:angular-numbro@1.2.2": {
      "numbro": "npm:numbro@1.2.2"
@guybedford here is the bottom of my index
https://gist.github.com/robertbaker/44c299306c059afe5126