कोणीय 2 सामग्री डिजाइन अल्फा.9-3 में @ कोणीय/सामग्री

Question

के लिए '404 नहीं मिला' है, मैंने कोणीय सामग्री 2 पर निर्देशों का पालन किया है @ कोणीय/सामग्री को स्थापित करने के लिए प्रारंभ करना। एटम के माध्यम से, मैंने पैकेज.जेसन, ऐप. मॉड्यूल अपडेट किया है, और प्रारंभ करने वाले निर्देशों से परे, मैंने systemjs.config को निम्नानुसार अपडेट किया है: '@ कोणीय/सामग्री': 'नोड_मोड्यूल/@ कोणीय/सामग्री',

I इन त्रुटियों को मिलता है: zone.js: 1274 प्राप्त http://localhost:3000/node_modules/@angular/material/ 404 (नहीं मिला)

(SystemJS) XHR त्रुटि (404 Not Found) लोड हो रहा है http://localhost:3000/node_modules/@angular/material (...)

मेरा मानना ​​है कि मैं तथ्य यह है कि इस समस्या पर नज़र रखी है कई @angular फ़ोल्डर्स में बंडल उप-फ़ोल्डर होता है जिसमें umd फ़ाइल होती है, लेकिन @ कोणीय/सामग्री फ़ोल्डर में बंडल उप-फ़ोल्डर नहीं होता है। इसलिए, 'अनपॅकिंग' फ़ंक्शन @ कोणीय/सामग्री/material.umd.js

systemjs मेरे आराम क्षेत्र से बाहर नहीं है इसलिए मुझे उपरोक्त के बारे में निश्चित नहीं है, लेकिन मैं 404 को हल करने में सक्षम नहीं हूं अल्फा 9-3 की नई फ़ाइल संरचना के साथ समस्या यहां प्रासंगिक कोड है (अन्य घटक दिखाए नहीं गए हैं)।

package.json

"@angular/material": "2.0.0-alpha.9-3", 

app.module

import { MaterialModule } from '@angular/material'; 
@NgModule({ 
    imports: MaterialModule.forRoot(), 

systemjs.config

(function(global) { 
    var map = { 
     'app': 'app', 
     // angular bundles 
     '@angular':     'node_modules/@angular', 
     // other libraries 
     'angular2-in-memory-web-api': 'node_modules/angular2-in-memory-web-api', 
     'rxjs':      'node_modules/rxjs', 
     '@angular/material': 'node_modules/@angular/material', 
    }; 
    var packages = { 
     'app': { main: 'main.js', defaultExtension: 'js' }, 
     'rxjs':{ defaultExtension: 'js' }, 
     'angular2-in-memory-web-api': { main: 'index.js', defaultExtension: 'js' }, 
    }; 
    var ngPackageNames = [ 
    'common', 
    'compiler', 
    'core', 
    'forms', 
    'http', 
    'platform-browser', 
    'platform-browser-dynamic', 
    'platform-server', 
    'router', 
    'upgrade', 
    ]; //adding 'material' to the array causes a different 404 error 
    function packIndex(pkgName) { 
     packages['@angular/'+pkgName] = { main: 'index.js', defaultExtension: 'js' }; 
    } 
    function packUmd(pkgName) { 
     packages['@angular/'+pkgName] = { main: 'bundles/' + pkgName + '.umd.js', defaultExtension: 'js' }; 
    } 
    var setPackageConfig = System.packageWithIndex ? packIndex : packUmd; 
    ngPackageNames.forEach(setPackageConfig); 
    var config = { 
     map: map, 
     packages: packages 
    }; 
    System.config(config); 

    })(this); //end of function(global) 

मैं अपने फ़ोल्डर/फ़ाइल संरचना और @ कोणीय/सामग्री/सामग्री जाँच कर ली है। umd.js निश्चित रूप से वहाँ है। मैं 404 से कैसे छुटकारा पा सकता हूं?

Answer 1

निकालें से map

निम्नलिखित '@ कोणीय/सामग्री': 'node_modules/@ कोणीय/सामग्री',

ngPackageNames सरणी material जोड़ें:

var ngPackageNames = [ 
... 
'material' 
]; 

और उसके बाद फ़ंक्शन को

के साथ बदलें 0

function packUmd(pkgName) { 
    packages['@angular/'+pkgName] = { 
    main: (pkgName !== 'material' ? 'bundles/' : '') + pkgName + '.umd.js', 
    defaultExtension: 'js' 
    }; 
} 

उसके बाद यह

काम करना चाहिए या angular2 जल्दी शुरू में इस तरह config का उपयोग करें:

(function (global) { 
    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: 'app', 
     // 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', 

     '@angular/animations': 'npm:@angular/animations/bundles/animations.umd.js', 
     '@angular/animations/browser': 'npm:@angular/animations/bundles/animations-browser.umd.js', 
     '@angular/platform-browser/animations': 'npm:@angular/platform-browser/bundles/platform-browser-animations.umd.js', 
     '@angular/material': 'npm:@angular/material/bundles/material.umd.js' 

     // other libraries 
     'rxjs':      'npm:rxjs' 
    }, 
    // packages tells the System loader how to load when no filename and/or no extension 
    packages: { 
     app: { 
     main: './main.js', 
     defaultExtension: 'js' 
     }, 
     rxjs: { 
     defaultExtension: 'js' 
     } 
    } 
    }); 
})(this);