带有 RequireJs 的 Angular-Material [英] Angular-Material with RequireJs

问题描述

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

today I'm tryng to configure angular material with requirejs but I receive an annoing problem:

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"
  ]

怎么了???

推荐答案

我遇到了同样的问题，你可以用这个解决方案破解它:https://github.com/angular/material/issues/456

I had the same issue, you can hack it with this solution: https://github.com/angular/material/issues/456

你需要做的只是用这个代理包装hammer.js.

What you need is just to wrrap the hammer.js with this proxy.

它对我有用，这是需要的文件:

it worked for me, here is the require file:

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

这里是hammer-proxy.js文件:

and here is hammer-proxy.js file:

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

如果您需要任何有关内嵌的帮助，请告诉我.

Let me know if you need any help with implamintation.

这篇关于带有 RequireJs 的 Angular-Material的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！