ng-bootstrap angular2 final release systemjs.config.js configuration problem
See original GitHub issuewith angular2 final release my ng-bootstrap systemjs.config.js configuration brooke
zone.js:1274 GET http://localhost:8080/mbs/traceur 404 (Not Found)
can some one help me with that
with angular rc.6 ng-bootstrap configuration which works perfect
(function(global) {
// map tells the System loader where to look for things
var map = {
'app': 'app', // 'dist',
'@angular': 'node_modules/@angular',
'angular2-in-memory-web-api': 'node_modules/angular2-in-memory-web-api',
'rxjs': 'node_modules/rxjs',
'@ng-bootstrap': 'node_modules/@ng-bootstrap',
'@ng-bootstrap/ng-bootstrap': 'node_modules/@ng-bootstrap/ng-bootstrap'
};
// packages tells the System loader how to load when no filename and/or no extension
var packages = {
'app': { main: 'main.js', defaultExtension: 'js' },
'rxjs': { defaultExtension: 'js' },
'angular2-in-memory-web-api': { main: 'index.js', defaultExtension: 'js' },
'@ng-bootstrap/ng-bootstrap': { main: 'index.js', defaultExtension: 'js' },
};
var ngPackageNames = [
'common',
'compiler',
'core',
'forms',
'http',
'platform-browser',
'platform-browser-dynamic',
'router',
'upgrade'
];
var ngBootstrapPackageNames = [
'accordion',
'alert',
'bundles',
'buttons',
'carousel',
'collapse',
'dropdown',
'esm',
'modal',
'pagination',
'popover',
'progressbar',
'rating',
'tabset',
'timepicker',
'tooltip',
'typeahead',
'util'
];
// 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' };
}
function ngBootstrapPackIndex(pkgName) {
packages['@ng-bootstrap/ng-bootstrap/' + pkgName] = {main: 'index.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);
ngBootstrapPackageNames.forEach(ngBootstrapPackIndex);
var config = {
map: map,
packages: packages
};
System.config(config);
})(this);
I tried to make it work with angular2 final release some thing as following (broken)
(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',
// other libraries
'rxjs': 'npm:rxjs',
'angular2-in-memory-web-api': 'npm:angular2-in-memory-web-api',
'@ng-bootstrap': 'npm:@ng-bootstrap',
'@ng-bootstrap/ng-bootstrap':'npm:@ng-bootstrap/ng-bootstrap',
'@ng-bootstrap/accordion':'npm:@ng-bootstrap/ng-bootstrap/accordion',
'@ng-bootstrap/alert': 'npm:@ng-bootstrap/ng-bootstrap/alert',
'@ng-bootstrap/bundles': 'npm:@ng-bootstrap/ng-bootstrap/bundles',
'@ng-bootstrap/buttons': 'npm:@ng-bootstrap/ng-bootstrap/buttons',
'@ng-bootstrap/carousel': 'npm:@ng-bootstrap/ng-bootstrap/carousel',
'@ng-bootstrap/collapse': 'npm:@ng-bootstrap/ng-bootstrap/collapse',
'@ng-bootstrap/dropdown': 'npm:@ng-bootstrap/ng-bootstrap/dropdown',
'@ng-bootstrap/esm': 'npm:@ng-bootstrap/ng-bootstrap/esm',
'@ng-bootstrap/modal': 'npm:@ng-bootstrap/ng-bootstrap/modal',
'@ng-bootstrap/pagination': 'npm:@ng-bootstrap/ng-bootstrap/pagination',
'@ng-bootstrap/popover': 'npm:@ng-bootstrap/ng-bootstrap/popover',
'@ng-bootstrap/progressbar': 'npm:@ng-bootstrap/ng-bootstrap/progressbar',
'@ng-bootstrap/rating': 'npm:@ng-bootstrap/ng-bootstrap/rating',
'@ng-bootstrap/tabset': 'npm:@ng-bootstrap/ng-bootstrap/tabset',
'@ng-bootstrap/timepicker': 'npm:@ng-bootstrap/ng-bootstrap/timepicker',
'@ng-bootstrap/tooltip': 'npm:@ng-bootstrap/ng-bootstrap/tooltip',
'@ng-bootstrap/typeahead': 'npm:@ng-bootstrap/ng-bootstrap/typeahead',
'@ng-bootstrap/util': 'npm:@ng-bootstrap/ng-bootstrap/util',
},
// 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'
},
'angular2-in-memory-web-api': {
main: './index.js',
defaultExtension: 'js'
}
}
});
})(this);
Issue Analytics
- State:
- Created 7 years ago
- Comments:5 (1 by maintainers)
Top Results From Across the Web
angular2 final release ng-bootstrap systemjs.config.js issue
js ', defaultExtension: 'js'}; } // Most environments should use UMD; some (Karma) need the individual index files var setPackageConfig = System.
Read more >angular2 final release ng-bootstrap systemjs.config.js issue ...
If you are using SystemJS, you should adjust your configuration to point to the UMD bundle. So i guess you should use configuration...
Read more >Angular 7 Upgrade: "TypeError: System.config is not a function"
I inherited an Angular 2 application and have been striving to update to Angular 7. After upgrading the Angular and the latest supporting...
Read more >angular js app 404 not found on kubernetes - You.com
The configuration works as-is. It seems the ingress needed force restart in the way of deleting it and applying again. Open side panel....
Read more >@ng-bootstrap/ng-bootstrap - npm
Latest version : 13.0.0, last published: 3 months ago. ... Welcome to the Angular 2 version of the Angular UI Bootstrap library.
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
hey buddy some one helped me on stackoverflow and resolved the issue.
simply load bundle instead of individual modules. check out below
This is a support request that was answered on StackOverflow so closing it here.