I tried to include the carousel in my angular project and added the required dependencies via npm install angular-jk-carousel --save and its gets installed in node_modules folder successfully,
Src
https://github.com/juank11memphis/angular-jk-carousel
and added jkAngularCarousel as dependency to module and included the script and css file in index and its not working,
How to use the node module dependencies to include to work properly?
myproject/
--/bower-components/
--/gulp/
--/.tmp/
--/node-modules/
---/angular-jk-carousel
--/src/
---/app
----/app.module.js
----/app.run.js
----/app.route.js
----/mydev/
-------/app.mydev.module.js
-------/app.mydev.config.js
-------/app.mydev.controller.js
-------/app.mydev.tmpl.html
---/index.html
--package.json
--bower.json
--gulpfile.js
--.bowerrc
app.module.js
(function() {
'use strict';
angular
.module('app', [
'ui.router','ngAnimate', 'ngCookies', 'ngSanitize', 'ngMessages', 'ngMaterial','googlechart', 'chart.js', 'ui.calendar', 'angularMoment', 'uiGmapgoogle-maps', 'md.data.table', 'ngFileUpload','app.mydev',
'jkAngularCarousel'
])
})();
package.json
{
"name": "ABC",
"version": "2.5.0",
"private": true,
"devDependencies": {
"angular-jk-carousel": "^0.1.6",
//other dependencies
},
"engines": {
"node": ">=0.10.0"
}
}
index.html
<!doctype html>
<html class="no-js" ng-app="app">
<head>
<!-- build:css({.tmp/serve,src}) styles/vendor.css -->
<!-- bower:css -->
<!-- endbower -->
<!-- endbuild -->
<!-- build:css({.tmp/serve,src}) styles/app.css -->
<!-- inject:css -->
<!-- css files will be automatically insert here -->
<!-- endinject -->
<!-- endbuild -->
</head>
<body translate-cloak ng-class="bodyClasses">
<div layout="row" ui-view="main"></div>
<!-- build:js(src) scripts/vendor.js -->
<!-- bower:js -->
<!-- endbower -->
<!-- endbuild -->
<!-- build:js({.tmp/serve,.tmp/partials,src}) scripts/app.js -->
<!-- inject:js -->
<!-- js files will be automatically insert here -->
<!-- endinject -->
<!-- inject:partials -->
<!-- angular templates will be automatically converted in js and inserted here -->
<!-- endinject -->
<!-- endbuild -->
<script src="../node_modules/angular-jk-carousel/dist/jk-carousel.min.js"></script>
<link href="../node_modules/angular-jk-carousel/dist/jk-carousel.min.css" >
</body>
</html>
console
GET http://localhost:3001/node_modules/angular-jk-carousel/dist/jk-carousel.min.js
(index):316 GET http://localhost:3001/node_modules/angular-jk-carousel/dist/jk-carousel.min.js
angular.js:68 Uncaught Error: [$injector:modulerr] Failed to instantiate module app due to:
Error: [$injector:modulerr] Failed to instantiate module jkAngularCarousel due to:
Error: [$injector:nomod] Module 'jkAngularCarousel' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.