module is not defined error in browser when using a bundled js file produced by AOT and rollup

I’m submitting a … (check one with “x”)

[x] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question

Current behavior

While there has already been lot of talk and issues on module.id, This issues arises specifically after AOT and rollup. Following the AOT tutorial from angular.io website, after all the steps are successfully completed, and the whole application is in one build.js file, then running the application in browser throws error that “Uncaught ReferenceError: module is not defined”. I’m aware that obviously this is happening because plain JavaScript doesn’t know what “module” is.

Expected behavior

Should’t ngc or rollup take care of this during the build process so that browser doesn’t complain?

I’ve seen similar question on StackOverflow which is unanswered and a question in Google groups.

Can’t seem to find a solution

Please tell us about your environment:

• Angular version: 2.0.1

• Browser: [Chrome 53, haven’t tested elsewhere ]

• Language: [all | TypeScript 2.0.3 | ES6/7 | ES5]

• Node (for AoT issues): node --version = 4.6.0

[singhjusraj]

@robwormald I’m aware that moduleis purely commonJS.

For JIT mode I’m using SystemJS.

While development I need to run application in JIT mode. But my question is how can I generate a rollup bundle with the same code?

Do I need to make changes in my components each time I need to generate a rollup build?

Thanks for you help

[Craig-Cooke]

If your error is module is not defined after bundling using AOT just add the following to the head of your production index.html file:

<script>window.module = "name of your app";</script>

module is a global variable.

You don’t need this in JIT mode with systemjs.