Closed ipuneetsingh closed 7 years ago
Yes. If you are using systemjs then you need to map this in systemjs configuration file.
i did that too, i mapped the index file but then it also require me to map each and every dependency owl carousel rely on.
There are only two libraries this library relies on jquery and owl carousel. You may need to map owl.carousel in your map file.
(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',
'@ng-bootstrap/ng-bootstrap': 'node_modules/@ng-bootstrap/ng-bootstrap/bundles/ng-bootstrap.js',
'owl.carousel': 'node_modules/owl.carousel/dist/owl.carousel.js',
'ng2-owl-carousel': 'node_modules/ng2-owl-carousel/index.js',
// other libraries
'rxjs': 'npm:rxjs',
'angular-in-memory-web-api': 'npm:angular-in-memory-web-api/bundles/in-memory-web-api.umd.js'
},
// packages tells the System loader how to load when no filename and/or no extension
packages: {
app: {
defaultExtension: 'js',
meta: {
'./*.js': {
loader: 'systemjs-angular-loader.js'
}
}
},
rxjs: {
defaultExtension: 'js'
}
}
});
})(this);
this is my systemjs config
this is the error now
i resolved the issue by adding .js in require statements in owl-carousel.component.js and index.js
Try adding entry for ng2-owl-carousel in pacakges key in your systemJs config file.
//update map
....
map: {
....
'ng2-owl-carousel': 'node_modules/ng2-owl-carousel',
}
...
...
// packages tells the System loader how to load when no filename and/or no extension
packages: {
app: {
defaultExtension: 'js',
meta: {
'./*.js': {
loader: 'systemjs-angular-loader.js'
}
}
},
rxjs: {
defaultExtension: 'js'
},
ng2-owl-carousel: {
main: './index.js'
defaultExtension: 'js'
}
}
yup that worked, thanx!!!
i eventually learned about this of fixing the mapping issue but didn't knew how to do it. I learned a new thing today.
i am trying this for the first time, and did everything as the steps suggested, do i have to map this to systemjs file too?