带有RequireJs的角度材质

时间:2014-12-19 14:12:47

标签: angularjs requirejs angular-material

今天我尝试用requirejs配置角度材料,但是我收到了一个令人讨厌的问题:

Error: ngMaterial requires HammerJS to be preloaded.

这是我的配置文件:

require.config
  paths:
    jquery: "../bower_components/jquery/dist/jquery"
    domReady: "../bower_components/requirejs-domready/domReady"
    underscore: "../bower_components/underscore/underscore"
    store: "../bower_components/store-js/store"
    moment: "../bower_components/moment/min/moment-with-langs"
    jsonPath: "../libs/jsonpath-0.8.0"

    es5Shim: "../bower_components/es5-shim/es5-shim"
    consoleShim: "../bower_components/console-shim/console-shim"
    json3: "../bower_components/json3/lib/json3.min"
    promise: "../bower_components/es6-promise/promise.min"

    hammer: "../bower_components/hammerjs/hammer"
    angular: "../bower_components/angular/angular"
    ngAnimate: "../bower_components/angular-animate/angular-animate.min"
    ngAria: "../bower_components/angular-aria/angular-aria.min"
    ngMaterial: "../bower_components/angular-material/angular-material"
    ngRoute: "../bower_components/angular-route/angular-route"

    baseObject: "scripts/helpers/base-object"
    app: "scripts/app/app"
    env: "../env"

  shim:
    hammer:
      exports: "Hammer"

    angular:
      exports: "angular"
      deps: [ "jquery" ]

    ngRoute:
      exports: "angularRoute"
      deps: [ "angular" ]

    ngAnimate:
      exports: "angularAnimate"
      deps: [ "angular" ]

    ngAria:
      exports: "angularAria"
      deps: [ "angular" ]

    ngMaterial:
      exports: "angularMaterial"
      deps: ["Hammer", "angular"]

    underscore:
      exports: "_"

    jsonPath:
      exports: "jsonPath"

    promise:
      exports: "Promise"

  deps: [
    "jquery","hammer", "angular", "ngMaterial", "ngAnimate", "ngAria", "consoleShim", "es5Shim", "consoleShim",
    "json3", "underscore", "baseObject", "promise", "env"
  ]

出了什么问题?

1 个答案:

答案 0 :(得分:1)

我有同样的问题,您可以使用此解决方案破解它: https://github.com/angular/material/issues/456

你需要的只是用这个代理来扭曲hammer.js。

它适用于我,这是require文件:

'hammer': 'lib/hammerjs/hammer.min',
'hammerProxy': 'js/requirejs-proxy/hammer-proxy',
...
'angularMaterial': {
     deps: ['angular', 'angular-animate', 'hammerProxy', 'angular-aria']
}

这里是hammer-proxy.js文件:

define(['hammer'], function (Hammer) {
    this.Hammer = Hammer;
    return Hammer;
});

如果您需要任何有关分解的帮助,请告诉我。