SystemJS, Angular2: switching between min/dev bundle

Viewed 525

I want to use Angular2 along with SystemJS, in such way so I can easily switch between production and development. In development I prefer to use class per file, rather than in production I'd like to use single minimized angular2 bundle.

Currently I have the following index.html and config.js:

indexl.html:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" type="text/css" href="/node_modules/bootstrap/dist/css/bootstrap.css"/>
    <script type="text/javascript" src="/node_modules/angular2/bundles/angular2-polyfills.js"></script>
    <script type="text/javascript" src="/node_modules/systemjs/dist/system.js"></script>
    <script type="text/javascript" src="/js/config.js"></script>
    <script>
        System.import('ts/main.ts').catch(console.error.bind(console));
    </script>
</head>
<body>
<my-app>Loading...</my-app>
</body>
</html>

config.js:

System.config({
    transpiler: 'typescript',

    typescriptOptions: {
        emitDecoratorMetadata: true
    },

    map: {
        'angular2': '/node_modules/angular2',
        'rxjs': '/node_modules/rxjs'
    },

    paths: {
        'typescript': 'node_modules/typescript/lib/typescript.js',
        'http': 'node_modules/angular2/bundles/http.dev.js'
    },

    packages: {
        angular2: {
            defaultExtension: 'js'
        },
        rxjs: { defaultExtension: 'js' },
    }
});

Question:

The above code works good for development. Please suggest, how to change System.config in order to use angular2 from a single /node_modules/angular2/bundles/angular2.min.js. Adding angular2.min.js to <script ...></script> is not an option, because in this case I will not be able to switch between dev and min bundles dynamically (assume that index.html is a static page)

2 Answers
Related