Question

我是angular2的新手，我想知道systemjs.config.js文件中存在的所有对象的使用。

System.config({
    paths: {
        // paths serve as alias
        'npm:': 'node_modules/'
    },
    // map tells the System loader where to look for things
    map: {
        // our app is within the app folder
        app: 'dist',
        main: 'main.js',

        // angular bundles
        '@angular/core': 'npm:@angular/core/bundles/core.umd.js',
        '@angular/common': 'npm:@angular/common/bundles/common.umd.js',
        '@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js',
        '@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js',
        '@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
        '@angular/http': 'npm:@angular/http/bundles/http.umd.js',
        '@angular/router': 'npm:@angular/router/bundles/router.umd.js',
        '@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js',

        // other libraries
        'rxjs': 'npm:rxjs',
        'angular-in-memory-web-api': 'npm:angular-in-memory-web-api/bundles/in-memory-web-api.umd.js',
        'primeng':                   'npm:primeng'      
    },
    // packages tells the System loader how to load when no filename and/or no extension
    packages: {
        app: { main: 'main.js', defaultExtension: 'js' },
        api: { defaultExtension: 'js' },
        rxjs: {defaultExtension: 'js'},
        'node_modules/primeng': {
            format: 'cjs',
            defaultExtension: 'js'
          }
         }

});

例如，上面粘贴的代码包含路径等对象，可用于指定别名，我想知道地图的使用方法和所有地图的内部对象，等等。

Answer 1

好吧，首先你要告诉npm软件包的位置，通常在根目录，因此：

paths: {
    // paths serve as alias
    'npm:': 'node_modules/'
}

然后你给你将要使用的包给别名（快捷方式名称），在这种情况下是角度和一些第三方库，如rxjs，...

map: {
        // our app is within the app folder
        app: 'dist',
        main: 'main.js',

        // angular bundles
        '@angular/core': 'npm:@angular/core/bundles/core.umd.js',
        '@angular/common': 'npm:@angular/common/bundles/common.umd.js',
        '@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js',
        '@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js',
        '@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
        '@angular/http': 'npm:@angular/http/bundles/http.umd.js',
        '@angular/router': 'npm:@angular/router/bundles/router.umd.js',
        '@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js',

        // other libraries
        'rxjs': 'npm:rxjs',
        'angular-in-memory-web-api': 'npm:angular-in-memory-web-api/bundles/in-memory-web-api.umd.js',
        'primeng':                   'npm:primeng'      
    }

因此，在导入库时不要输入整个路径（例如'npm：@ angular / core / bundles / core.umd.js'），您只需要导入你给它的别名（'@angular /核心'）。导入别名时，您确定要导入正确的库。

在库的完整路径前面的'npm：'指的是你在上面启动的路径'npm'。

angular2中的systemjs.config.js

1 个答案: