Question

我目前正在开发一个Angular 2应用程序，其中要求是将所有生成的javascript文件放到单个.js文件中（即：output.js）

现在，我已经在System.config.js中添加了地图配置。

我们通常会给出各个模块的文件夹位置。

例如。）

＆＃13;

var map = {
  '@angular': 'node_modules/@angular'
};

＆＃13;

但现在我将所有内容都放在一个Javascript文件中，如何映射这些条目？

我面临的问题是，每当我尝试加载html时，它会在内部查找@angular模块并因路径不同而失败。

我的HTML看起来像这样，

＆＃13;

<html>

<head>
  <script src="output.js"></script>
</head>

<body>
<test-app>Loading...</test-app>
<script>
  System.import('runtime/main').then(null, function(err) {console.log(err)});
</script>


</body>

</html>

＆＃13;

我的System.config.js看起来像这样，

＆＃13;

(function (global) {

    // map tells the System loader where to look for things
   var map = {
        'app': 'dist', // 'dist',
        'rxjs': 'node_modules/rxjs',
        'angular2-in-memory-web-api': 'node_modules/angular2-in-memory-web-api',
        '@angular': 'node_modules/@angular',
        'ng2-img-cropper': 'ng2-img-cropper'
    };
  
  //The above is where I face problems. Since it points to node_modules, I want this to be changed

    // packages tells the System loader how to load when no filename and/or no extension
    var packages = {
        'app': {main: 'newAgain.js', defaultExtension: 'js'},
        'rxjs': {defaultExtension: 'js'},
        'angular2-in-memory-web-api': {defaultExtension: 'js'},
    };

    var packageNames = [
        '@angular/common',
        '@angular/compiler',
        '@angular/core',
        '@angular/platform-browser',
        '@angular/platform-browser-dynamic'
    ];

    // add package entries for angular packages in the form '@angular/common': { main: 'index.js', defaultExtension: 'js' }
    packageNames.forEach(function (pkgName) {
        packages[pkgName] = {main: 'index.js', defaultExtension: 'js'};
    });

    var config = {
        packages: packages
    };

    // filterSystemConfig - index.html's chance to modify config before we register it.
    if (global.filterSystemConfig) {
        global.filterSystemConfig(config);
    }

    System.config(config);

})(this);

＆＃13;

要点：

我有一个html文件
我有一个.js文件（output.js），其中包含来自所有依赖项的脚本以及项目特定的js。（像angular，systemjs，rxjs，....）

要求：

在system.config.js配置中正确链接/映射模块。

任何帮助将不胜感激！

感谢。

Answer 1

最后！我能够得到上述解决方案的答案。我实际上把它作为一个git存储库。

如果有人正在为这些问题寻找答案。 Github - angular2-bundle-all-single-script

System.config映射来自单个.js文件的@angular模块

1 个答案: