Не удалось найти HammerJS в угловом 6

Я использую угловой материал в своем проекте. Я получаю это предупреждение:

Не удалось найти HammerJS. Некоторые компоненты углового материала могут работать неправильно.

Событие "longpress" не может быть связано, потому что Hammer.JS не загружен, и пользовательский загрузчик не указан.

Я знаю, что это дубликат этого вопроса

В ответ они упомянули, что:

  1. Мы должны добавить "^2.0.8", к dependencies в файле package.json.
  2. импорт 'hammerjs/hammer'; в файле polyfills.ts.

В моем случае все в порядке, но я получаю то же предупреждение в консоли браузера.

Ответы

Ответ 1

Есть два способа решить эту проблему:

  1. Либо polyfills.ts (основной) импорт в файл основного модуля, либо polyfills.ts:

    import 'hammerjs';

  2. Или включите скрипт из CDN в файл index.html:

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

Ответ 2

с помощью angular6 вы можете включить путь hammerjs в node_modules в файле angular.json.

Angular doc говорит, что целью файла angular.json является

Параметры конфигурации CLI по умолчанию для всех проектов в рабочей области, включая параметры конфигурации для инструментов сборки, обслуживания и тестирования, которые использует CLI, такие как TSLint, Karma и Protractor. Для получения дополнительной информации см. Конфигурация углового рабочего пространства.

Вы можете включить путь модуля узла 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": {
          ....

Обратите внимание, что вы должны перезапустить службу, чтобы она вступила в силу.