首页 文章

为什么NPM在聚合物元素中安装另一个node_modules文件夹？如何修复它？

提问于
浏览 次
1

问题

我正在关注"Build an App with App Toolbox"教程 . 我遇到了第3步"add some elements"的问题，一旦我尝试添加 paper-checkbox 元素，视图就不会显示 .

经过一些试验和错误后，我发现 paper-checkbox 文件夹中有一个额外的 node_modules 文件夹 . 这导致视图中断，因此不显示（更多内容见下文） . 为什么会发生这种情况？如何解决这个问题？

Tutorial Link

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 时，它显示正确，如下所示：
enter image description here

但是，当我在 my-new-view.js 中为 paper-checkbox 元素添加import语句时， import '@polymer/paper-checkbox/paper-checkbox.js'; 视图无法显示：

enter image description here

在与另一个项目进行一些代码比较后，我发现 paper-checkbox 文件夹不匹配（见下面的截图） . 它包含一个重复的 node_modules 文件夹，其中包含一个重复的 @polymer 文件夹 . 该聚合物文件夹包含 font-robota 和其他已包含在顶部聚合物目录中的模块;甚至更多重复的内容 .

enter image description here

此外，在检查网页时，控制台（在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

由于存在重复内容，因此发生此错误 . 为了解决这个问题，我只是删除了checkbox元素中的 node_modules 文件夹 .

我也尝试过安装 paper-input . paper-input 需要 iron-input . 运行 npm install @polymer/paper-input 后，同一个 node_modules 文件夹安装在铁和纸输入元件中 . 我删除了这两个文件夹，然后元素终于工作了 .

为什么npm这样做？我该如何解决？

Github Project Repo

https://github.com/starkindustries/my-first-polymer-app

Version Info

  • Git版本2.17.1（Apple Git-112）

  • NPM版本6.4.1

  • 节点版本v10.10.0

  • Polymer CLI版本1.8.0

  • Chrome版本69.0.3497.100（官方版）（64位）

polymer polymer-starter-kit polymer-3.x

1 回答

  • 0

    你从项目根运行了 npm install @polymer/paper-checkbox 吗？如果从 papaer-checkbox 文件夹的根目录运行 npm install 命令，它将读取它's dependency folder from it'的package.json文件并安装它们 .

    回复于

相关问题