Main.js 未找到（SystemJS，Angular2）答案

【问题标题】：Main.js not found (SystemJS, Angular2)Main.js 未找到（SystemJS，Angular2）
【发布时间】：2016-08-27 15:29:51
【问题描述】：

我一直在将我的 Angular2 RC4 应用升级到 RC5 版本，但我突然遇到了这个问题。

我的应用程序编译正常，但是当我在 localhost:3001 加载页面时，我的 main.js 得到 404。

我也在使用 gulp。

这是我的文件结构：

.
+-- src
|   +-- app
|   |   +-- main.ts
|   |   +-- app.module.js
|   |   +-- app.component.ts
|   |   +-- app.component.html
|   |   +-- components <-- Directory
|   |   +-- services <-- Directory
|   |   +-- models <-- Directory
|   +-- system.config.js
|   +-- index.html
+-- tsconfig.json
+-- typings.json

这是我的 system.config.js： js

(function (global) {
    // map tells the System loader where to look for things
    var map            = {
        'app'      : 'app', // 'dist',
        '@angular' : 'node_modules/@angular',
        'rxjs'     : 'node_modules/rxjs',
        '@models'  : 'app/models',
        '@services': 'app/services',
        '@model_services': 'app/services/model_services',
        'moment'   : 'node_modules/moment/moment.js',
        'ng2-bootstrap': 'node_modules/ng2-bootstrap'
    };
    // packages tells the System loader how to load when no filename and/or no extension
    var packages       = {
        'app' : {main: 'main', defaultExtension: 'js'},
        'rxjs': {defaultExtension: 'js'},
        '@models': {main: 'index'},
        '@services': {main: 'index'},
        '@model_services': {main: 'index'}
    };
    var ngPackageNames = [
        'common',
        'compiler',
        'core',
        'http',
        'platform-browser',
        'platform-browser-dynamic',
        'router'
    ];
    // Individual files (~300 requests):
    function packIndex(pkgName) {
        packages['@angular/'+pkgName] = { main: 'index.js', defaultExtension: 'js' };
    }
    // Bundled (~40 requests):
    function packUmd(pkgName) {
        packages['@angular/'+pkgName] = { main: '/bundles/' + pkgName + '.umd.js', defaultExtension: 'js' };
    }
    // Most environments should use UMD; some (Karma) need the individual index files
    var setPackageConfig = System.packageWithIndex ? packIndex : packUmd;
    // Add package entries for angular packages
    ngPackageNames.forEach(setPackageConfig);
    var config = {
        defaultJSExtensions: true,
        map: map,
        packages: packages
    };
    System.config(config);
})(this);

【问题讨论】：

在您的 systemjs.config.js 文件中，您是否尝试将 'app' : {main: 'main', defaultExtension: 'js'}, 更改为 'app': { main: 'main.js', defaultExtension: 'js' }, ？
原来是这样的。
您已经向我们展示了您的 .ts 文件的文件夹结构。当404 出现时，向我们展示浏览器尝试加载main.js 的路径。还向我们展示编译后的.js 文件的文件夹结构，或者至少是main.js 的正确路径

标签： angular typescript gulp systemjs

【解决方案1】：

我最终修复了它。我认为这实际上是 gulp 的问题，因为 dist 文件夹非常混乱。

我最终重新克隆了项目，现在一切正常。

【讨论】：