第三方节点模块依赖关系在角度js中不起作用

时间:2016-09-09 08:14:20

标签: javascript angularjs node.js node-modules angular-carousel

我尝试在我的角度项目中包含轮播,并通过npm install angular-jk-carousel --save添加所需的依赖项,并将其成功安装在node_modules文件夹中,

的Src https://github.com/juank11memphis/angular-jk-carousel 并将jkAngularCarousel添加为模块的依赖项,并将脚本和css文件包含在索引中并且无法正常工作,

如何使用节点模块依赖项来包含才能正常工作?

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>

控制台

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.

0 个答案:

没有答案