使用 systemJS 加载 Firebase 时缺少扩展

Question

我正在编写一个 Angular2 应用程序，它通过 AngularFire2 使用 Firebase，但我运行在加载 Firebase 文件时遇到了问题。 SystemJS 引导应用程序，加载 firebase.js，但之后由于缺少扩展名而无法加载其中所需的文件。特别是，它将请求发送到 http://localhost:8080/node_modules/firebase/app 而不是 http://localhost:8080/node_modules/firebase/app.js。后者存在于捆绑包中，因此绝对是正确的加载方式。

这是我的 system.config.js:

(function(global) {

// map tells the System loader where to look for things
var map = {
    'aviary':                               'js',
    'rxjs':                                 'npm:rxjs',
    'firebase':                             'npm:firebase/firebase.js',
    'firebase/app':                         'npm:firebase/app.js',
    'angularfire2':                         'npm:angularfire2',
    '@angular':                             'npm:@angular'
};

// packages tells the System loader how to load when no filename and/or no extension
var packages = {
    'aviary':                       { main: 'main.js',  defaultExtension: 'js' },
    'rxjs':                         { defaultExtension: 'js' },
    'angular2-in-memory-web-api':   { main: 'index.js', defaultExtension: 'js' },
    'angularfire2':                 { main: 'bundles/angularFire2.umd.js', defaultExtension: 'js'},

};
var ngPackageNames = [
    'common',
    'compiler',
    'core',
    'forms',
    'http',
    'platform-browser',
    'platform-browser-dynamic',
    'router',
    'router-deprecated',
    'upgrade',
];

// 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 = {
    map: map,
    packages: packages,
    paths: {
        'npm:': 'node_modules/'
    }
};

System.defaultExtension = true;
System.config(config);

})(this);

我尝试过的其中一件事是

var packages = {
    //...
    'firebase':                     { defaultExtension: 'js' }
};

但这并没有帮助。感觉像是配置问题，但我正在努力弄清楚如何让它做我需要的事情。

Answer 1

在您的 system.config.js 中，firebase 的包配置不适用，因为您将 firebase 映射到一个文件，并且包配置基本上只适用于目录。只有当模块真的只是一个文件时，映射到文件才有效。当它需要从同一目录加载其他文件时，您必须将模块映射到该目录并在包配置中使用 main ，如下所示：

var map = {
    ...
    'firebase': 'npm:firebase',
}

和

var packages = {
     ...
    'firebase':  { main: 'firebase-browser.js' }
}

备注：

看来您不需要为 firebase/app
对于最新版本，firebase 的主文件是 firebase-browser.js，而不仅仅是 firebase.js
您不需要在包配置中使用 defaultExtension: 'js'，因为 js 已经是任何包的默认值。
我不确定这行是做什么的，当我删除它时没有任何变化：
```
System.defaultExtension = true;
```

使用 systemJS 加载 Firebase 时缺少扩展

Lack of extension when loading Firebase using systemJS

firebase

systemjs