Questions tagged [systemjs]

Spec-compliant universal module loader - loads ES6 modules, AMD, CommonJS and global scripts.

Designed as a small collection of extensions to the ES6 specification System loader, which can be applied individually or all together.

Features include:

  • Core: Some small fixes to the spec loader behavior.
  • Formats: Dynamically load AMD, CommonJS and global scripts (as well as ES6 modules) - detecting the format automatically, or with format hints.
  • Map: Map configuration.
  • Versions: Multi-version support for semver compatible version ranges (@^1.2.3 syntax).
  • Plugins: A dynamic plugin system for modular loading rules.
  • Bundles: Dynamically link requires to bundle files.

Designed to work with the ES6 Module Loader polyfill (15KB minified) for a combined footprint of 27KB. In future, with native implementations, the ES6 Module Loader polyfill should no longer be necessary. As jQuery provides for the DOM, this library can smooth over inconsistiencies and missing practical functionality provided by the native System loader.

Runs in the browser and NodeJS.


Useful links

1398 questions
14
votes
1 answer

Angular 2: How to tell SystemJS to use a bundle?

I have an Angular 2 RC7 app where I use SystemJS to load JavaScript files. This is my current configuration for SystemJS: (function (global) { System.config({ defaultExtension: 'js', defaultJSExtensions: true, paths: { …
Glenn Utter
  • 2,313
  • 7
  • 32
  • 44
14
votes
1 answer

JavaScript intercept module import

I have a SPA (in Aurelia / TypeScript but that should not matter) which uses SystemJS. Let's say it runs at http://spa:5000/app. It sometimes loads JavaScript modules like waterservice/external.js on demand from an external URL like…
ZoolWay
  • 5,411
  • 6
  • 42
  • 76
14
votes
1 answer

How to bundle lazy loaded components inside the production dist folder in angular-cli?

I am using angular-cli for development and I have used the following commands and code to build my project. npm install angular-cli (angular-cli: 1.0.0-beta.10) ng new my-app ng g component lazy-me Then added a file app.router.ts with the following…
Gan
  • 937
  • 8
  • 22
13
votes
1 answer

Bundle TypeScript with external JS files (e.g. node_modules)

I can successfully bundle together my Typescript project and save it as a single file using e.g. tsc --outFile "build/bundle.js" However, this file only contains the Typescript files and none of the files it includes from the "node_modules"…
fstr
  • 900
  • 3
  • 10
  • 31
13
votes
1 answer

Transpiling SASS on the fly with SystemJS

I read a lot of blogs that say SystemJS and SASS transpiling works, but every example I see online appears to handle the SASS processing up front (via a gulp-like task runner), and the JavaScript code then imports the generated CSS. What I'm hoping…
Brian Ball
  • 12,268
  • 3
  • 40
  • 51
13
votes
3 answers

How to bundle Angular2 RC1 with systemjs

Prior to the release candidates angular supplied a bundled file. Since the release candidates there's no more bundled file. Including angular2 and rxjs my app now makes 671 requests over 7secs to load. This has crippled development. Does anyone…
CurlyFro
  • 1,862
  • 4
  • 22
  • 39
13
votes
4 answers

SystemJS: Why am getting error jquery_1.default is not a function when importing jquery

I have installed foundation via jspm install foundation, then import foundation and jquery. The problem I am having is that if I import jquery via import $ as 'jquery' I get the error jquery_1.default is not a function. If I import jquery via…
dan
  • 2,857
  • 6
  • 34
  • 60
13
votes
4 answers

How can I configure the jsdom instance used by jest?

I've come up against this issue Invalid URL is thrown when requiring systemjs in jest test cases One of the last comments suggests "manipulate the jsdom instance to have a valid location / baseURI by setting the referrer config in jsdom." I'm…
user5325596
  • 2,310
  • 4
  • 25
  • 42
12
votes
2 answers

How to find NPM package on Unpkg

I'm trying to include an unpkg link to a particular NPM package 'Angular Calendar' in my system.config.js file so I can run my site on a server without building every time. I don't know how to find the link. The system.config.js file on the example…
franchyze923
  • 1,060
  • 2
  • 12
  • 38
12
votes
3 answers

Angular 2 bundle like import / Import multiple modules

I didn't know how to state the question... So, basically I'm writing my own application using Angular 2 with Typescript. I would like to make it possible to import my modules the way we do with Angular, where we can import multiple related modules…
digaomatias
  • 1,164
  • 10
  • 21
12
votes
2 answers

Issues getting Karma to work with SystemJS, Angular2 and Typescript

I am facing issues getting Karma to work with SystemJS, Angular2 and Typescript. Here is my karma.conf.js: 'use strict'; module.exports = function (config) { config.set({ // base path, that will be used to resolve files and exclude …
balteo
  • 23,602
  • 63
  • 219
  • 412
12
votes
2 answers

How could I use a system.import() into component angular 2

I saw in this post that you can use SystemJS to load external javascript files into my components in Angular 2. In my index.html :