These are chat archives for systemjs/systemjs

30th
Sep 2015
Sean G. Wright
@sgwatgit
Sep 30 2015 01:40

Any idea why I am receiving these browser console errors when I load my app?

Evaluating http://localhost/jspm_packages/npm/babel-core@5.8.25.js
    Error loading http://localhost/jspm_packages/npm/babel-core@5.8.25.js
    Error loading http://localhost/src/js/app/app.module.js

I'm using systemjs-builder 0.13.6
My config.js looks like ...

System.config({
  baseURL: "/src/js/app/",
  defaultJSExtensions: true,
  transpiler: "babel",
  babelOptions: {
    "optional": [
      "runtime",
      "optimisation.modules.system"
    ]
  },
  paths: {
    "app/*": "*",
    "public/*": "/public/*",
    "github:*": "/jspm_packages/github/*",
    "npm:*": "/jspm_packages/npm/*"
  },

  meta: {
    "app/*": {
      "format": "esm"
    }
  },

  map: {
...
Jayson Harshbarger
@Hypercubed
Sep 30 2015 02:40
@sgwatgit Nice, I hadn't thought of running ng-annotate on the bundle. Makes me wonder though, can we somehow inject ng-annotate into the systemjs build step? SystemJS Builder ng-annotate plugin?
Sean G. Wright
@sgwatgit
Sep 30 2015 03:02
@Hypercubed that would be great. i don't think i'm smart enough to figure out a way to grab a stream from builder.build() and pipe that into ngannotate. i have my builder.build() going to a .tmp directory at the moment and ngAnnotate runs on the bundle in .tmp.
Ryan Wischkaemper
@ryanwischkaemper
Sep 30 2015 04:53
does anyone know the best way to save bundles configuration in my config.js file while using an in-memory build?
Sean G. Wright
@sgwatgit
Sep 30 2015 05:18

So my issue appears to be caused by babel-core@5.8.25 and babel-runtime@5.8.25 because when I was using earlier versions I wasn't having this issue.

EDIT - nevermind - this was a config.js baseURL issue

Any idea why I am receiving these browser console errors when I load my app?

Evaluating http://localhost/jspm_packages/npm/babel-core@5.8.25.js
    Error loading http://localhost/jspm_packages/npm/babel-core@5.8.25.js
    Error loading http://localhost/src/js/app/app.module.js

...

Sean G. Wright
@sgwatgit
Sep 30 2015 05:35

Or not ... In one app I created there is no issue, in another more complex version with the same structure and bundle process I receive the error with babel-core. I have no idea how to track down the cause. Feeling lost in the weeds atm.

EDIT - nevermind - this was a config.js baseURL issue

Simon Hampton
@simonh1000
Sep 30 2015 06:21
@Hypercubed I tried to read up about plugins as, yes, really we should try to make ngannotate an option. But the plugins seem to be about loading files rather than mid-stream processing, but perhaps that is a lck of insight on my behalf
Jayson Harshbarger
@Hypercubed
Sep 30 2015 07:25
@sgwatgit I'm doing the same. Building in a .tmp directory. I did this because I wanted to combine two directory structures before building. See here: https://github.com/Hypercubed/Project-Chi/blob/master/gulpfile.js#L102
@simonh1000 SystemJS plugins are used for both loading and building. Might be able to copy the coffee plugin (https://github.com/forresto/system-coffee/blob/master/coffee.js) but need to make sure translation happens before minification... it has to right?
Jayson Harshbarger
@Hypercubed
Sep 30 2015 07:31
Might still have the problem that ng-annotate doesn't support ES6.
Jayson Harshbarger
@Hypercubed
Sep 30 2015 11:48
Well, I don't know if it is a good idea or not but creating an ng-annotate plugin is possible... https://github.com/Hypercubed/systemjs-plugin-ng
Seems to bundle just fine... i.e. with annotations.
Sean G. Wright
@sgwatgit
Sep 30 2015 12:17
@Hypercubed does this require using the !ng notation with every import you wish to be annotated? i have a couple hundred .js files in my app and most need the annotation for DI
Jayson Harshbarger
@Hypercubed
Sep 30 2015 12:51
Maybe there is a way to apply a plugin to all js files or per package... I'm not sure.
Jayson Harshbarger
@Hypercubed
Sep 30 2015 12:58
In the long run it might be easier to switch to strictdi.
Maybe use the meta configuration to turn on the plugin by path: https://github.com/systemjs/systemjs/blob/master/docs/overview.md#basic-use
Sean G. Wright
@sgwatgit
Sep 30 2015 13:07
That definitely looks promising
Jayson Harshbarger
@Hypercubed
Sep 30 2015 13:13

Just tried this:

  meta: {
    'app/*.js': {
      loader: 'ng'
    }
  },

it seams to work.

But sometimes SystemJS magic is black magic.
Sean G. Wright
@sgwatgit
Sep 30 2015 13:21
awesome - i will try this out later this morning.
Jayson Harshbarger
@Hypercubed
Sep 30 2015 13:24
Might needs some work to add source maps.
Anyway, I'm done for the night (it's 10pm here). Let me know how it works, preferably on the Hypercubed/systemjs-plugin-ng issues.
Sharon (Sean) Rolel
@Mosho1
Sep 30 2015 15:58
Is it possible to prefetch modules? similar to how <link rel="prefetch" ... /> works
which I can't see to get working in FF/IE
Sean G. Wright
@sgwatgit
Sep 30 2015 15:59

@guybedford When my app loads, I have a breakpoint in system.src.js at

hook('instantiate', function(instantiate) {
    return function(load) {
      var loader = this;

The problem I'm running into is that load.name and load.address seem correct (localhost/src/js/app.module.js) but the load.source contains my index.html as its value. When that script is loaded at head.appendChild(script); it is loading the contents of index.html not the module found in my app.js which is my app bundle.

My vendor.js file starts with "bundle"; System.registerDynamic( but my app.js file starts with System.register(. Am I bundling incorrectly for this file? ( builder.build('[app/**/*], 'public/app.js', buildOptions);)