Вопрос
Я следую учебному пособию «Создание приложения с помощью панели инструментов приложения».У меня была проблема с шагом 3 «добавить некоторые элементы», когда представление не отображалось, когда я пытался добавить элемент paper-checkbox.
После некоторых проб и ошибок я обнаружил, что в папке paper-checkbox есть дополнительная папка node_modules.Это привело к тому, что представление сломалось и, следовательно, не отображается (подробнее об этом ниже)Почему это происходит и как это можно исправить?
Ссылка на учебник
https://www.polymer -project.org / 3.0 / start / toolbox / add-elements
Полная информация о проблеме
Я запустил проект с использованием интерфейса командной строки, запустил polymer init и выбрал polymer-3-starter-kit в соответствии с инструкциями учебника.Я выполнил следующую команду для установки paper-checkbox:
npm install @polymer/paper-checkbox
Обратите внимание, что после установки элемента я получаю следующее предупреждение:
npm WARN @babel/plugin-transform-classes@7.0.0-beta.35 requires a peer of @babel/core@7.0.0-beta.35 but none is installed. You must install peer dependencies yourself.
+ @polymer/paper-checkbox@3.0.0-pre.20
added 12 packages from 1 contributor and audited 13720 packages in 27.422s
found 46 vulnerabilities (25 low, 14 moderate, 5 high, 2 critical)
run npm audit fix to fix them, or npm audit for details
Я проверил свою папку node_modules иЯ вижу, что paper-checkbox был установлен.
До сих пор, когда я загружаю my-new-view, оно отображается правильно, например: 
Однако, когда я добавляю оператор импорта внутри my-new-view.js дляpaper-checkbox элемент, import '@polymer/paper-checkbox/paper-checkbox.js'; представление не отображается:
После некоторого сравнения кода с другим проектом, я вижу, что paper-checkboxпапка не совпадает (см. скриншот ниже).Он содержит дубликат папки node_modules, которая содержит дубликат папки @polymer.Эта полимерная папка содержит font-robota и другие модули, которые уже содержатся в верхнем полимерном каталоге;еще более дублированный контент.
Кроме того, при проверке веб-страницы консоль (в Chrome) выдает следующую ошибку:
Uncaught (in promise) DOMException: Failed to execute 'define' on 'CustomElementRegistry': this name has already been used with this registry at Polymer (http://127.0.0.1:8081/node_modules/@polymer/polymer/lib/legacy/polymer-fn.js:43:18)
at http://127.0.0.1:8081/node_modules/@polymer/paper-checkbox/node_modules/@polymer/iron-meta/iron-meta.js:141:1
Эта ошибка возникает из-за наличия дублированного содержимого.Чтобы решить эту проблему, я просто удалил папку node_modules внутри элемента checkbox.
Я также пытался установить paper-input.paper-input требуется iron-input.После запуска npm install @polymer/paper-input одна и та же папка node_modules устанавливается внутри элементов ввода железа и бумаги.Я удалил эти две папки, и затем элемент наконец заработал.
Почему npm делает это?И как я могу это исправить?
Репозиторий проекта Github
https://github.com/starkindustries/my-first-polymer-app
Информация о версии
- Git версии 2.17.1 (Apple Git-112)
- версия NPM 6.4.1
- версия узла v10.10.0
- версия CLI Polymer 1.8.0
- Chrome версии 69.0.3497.100 (официальная сборка) (64-разрядная версия)