在角度6中找不到HammerJS

Question

在角度6中找不到HammerJS

PGH*_*PGH 44 hammer.js angular-material angular

我在项目中使用了角度材质.我收到这个警告:

找不到HammerJS.某些Angular Material组件可能无法正常工作.

"longpress"事件无法绑定,因为未加载Hammer.JS且未指定自定义加载程序.

我知道这是这个问题的重复

他们在答案中提到:

我们必须添加"^2.0.8",到dependencies在的package.json文件.
'hammerjs/hammer';在 polyfills.ts文件中导入.

在我的情况下一切都很好,我仍然在浏览器控制台中收到相同的警告.

Answer 1

Edr*_*ric 67

有两种方法可以解决这个问题:

在主模块的文件中包含(主)导入或polyfills.ts:
```
import 'hammerjs';
```
Run Code Online (Sandbox Code Playgroud)

或者将CDN中的脚本包含到您的index.html文件中:

<head>
  <!-- ... -->
  <script src="https://cdnjs.cloudflare.com/ajax/libs/hammer.js/2.0.8/hammer.min.js"></script>
  <!-- ... -->
</head>

Run Code Online (Sandbox Code Playgroud)

Answer 2

Jun*_*711 12

使用angular6，您可以在angular.json文件的node_modules中包含Hammerjs路径。

Angular Doc表示angular.json文件的目的是

工作空间中所有项目的CLI配置默认值，包括用于CLI使用的构建，服务和测试工具（例如TSLint，Karma和Protractor）的配置选项。有关详细信息，请参见Angular Workspace配置。

您可以在脚本列表中包括Hammerjs节点模块路径。参见以下示例：

 "projects": {
    "demo": {
      "root": "",
      "sourceRoot": "src",
      "projectType": "application",
      "prefix": "app",
      "schematics": {},
      "architect": {
        "build": {
          "builder": "@angular-devkit/build-angular:browser",
          "options": {
            "outputPath": "dist/demo",
            "index": "src/index.html",
            "main": "src/main.ts",
            "polyfills": "src/polyfills.ts",
            "tsConfig": "src/tsconfig.app.json",
            "assets": [
              "src/favicon.ico",
              "src/assets",
              "src/manifest.json"
            ],
            "styles": [
              "src/styles.css"
            ],
            "scripts": [
              "node_modules/hammerjs/hammer.min.js" <- add path to hammerjs
            ]
          },
          "configurations": {
          ....

Run Code Online (Sandbox Code Playgroud)

请注意，您必须重新启动服务才能生效。