问题标签 [npm-link]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
750 浏览

angular - 使用自定义 Angular 库和 NPM 链接在 Storybook 中找不到组件 templateUrl 和 stylesUrl

我正在尝试创建一个新的 Angular 10 库和一个单独的 Storybook,因为它是文档和开发视图。当 html 和样式在 *.component.ts 文件中内联时,一切都按预期工作。但是,每当我尝试使用单独的 html 和 scss 文件创建新组件时,Storybook 都会在控制台中给出一个错误,即找不到.component.html/ .component.scss。

重现步骤

创建一个新库

这将生成一个具有以下设置的组件:

接下来我做的是构建库, cd 到dist/my-lib文件夹并运行npm link.

我还创建了另一个包含 Storybook 项目的 Angular 项目,我按照本教程开始使用它:https ://www.learnstorybook.com/intro-to-storybook/angular/en/get-started/

完成教程后,我将之前构建的库添加到故事书项目中npm link my-lib,并在其中创建了一个新的故事文件/src/stories。之后,我将组件导入故事文件中import { NotificationComponent } from 'my-lib';,一切似乎都很好,因为它可以在链接的 npm 包中找到正确的组件。

但是每当我运行 Storybook 时,npm run storybook我都会收到以下错误,因为它找不到正确的 templateUrl 和 styleUrl:

GET http://localhost:6006/notification.component.html 404 (Not Found)

zone.js:690 Unhandled Promise rejection: Failed to load notification.component.html ; Zone: <root> ; Task: Promise.then ; Value: Failed to load notification.component.html undefined

现在我想知道是否可以分离 html/scss/ts 文件,因为我更喜欢这样的可读性。如果这是可能的,我怎样才能确保运行故事书时组件的根不是./?我应该添加某种 webpack 配置还是有其他解决方案?

如果有任何不清楚的地方,请随时询问,我会尽力提供信息。

谢谢你和亲切的问候,

卫斯理

0 投票
3 回答
1790 浏览

angular - 使用链接库时,Angular 9 应用程序构建失败

我正在开发一个应用程序和一堆要在应用程序中使用的库。所有这些最近都升级到了 Angular 9。这些库被配置为在没有 ivy 的情况下构建,应用程序被配置为使用 ivy 构建,这符合升级指南。我曾经遵循的本地开发过程如下 -

  1. 使用 --watch 构建库和应用程序。
  2. 在库中进行更改。库构建成功后,复制 dist/my-lib 并将其粘贴到应用程序的 node_modules 文件夹中(这会触发应用程序构建)。

这一直有效到 Angular 8 及更低版本,但在 Angular 9 中,应用程序构建错误说: ERROR in Tried to overwrite path/node_modules/my-lib/lib/services/payment.service.d.ts.__ivy_ngcc_bak with an ngcc backup file ,这是不允许的。

所以,现在我必须另外做以下事情 -

  1. 停止应用程序构建。
  2. 从应用程序的 node_modules 中删除 lib,然后复制粘贴新的。
  3. 再次启动应用程序。

角度文档说要使用 npm 链接https://angular.io/guide/creating-libraries#linked-libraries。但我无法理解:

库的 package.json 配置指向正确的入口点。例如, main 应该指向 JavaScript 文件,而不是 TypeScript 文件。

我尝试了 npm link 但这不会触发应用程序构建并且我的更改没有反映。我想知道如何解决 npm 链接问题,或者是否有更好的方法将库和应用程序一起使用。

我的 lib 的 package.json 看起来像这样(因为我正在处理客户端应用程序,所以我只发布 package.json 结构):

0 投票
1 回答
175 浏览

javascript - NPM在同一个项目中链接多个功能/模块?

我有一些辅助函数希望在命令行中全局可用。按照本教程npm link,我已经能够实现这一点:

但是,我在一个项目中有几个,例如 standalone-functions/tool1.jsstandalone-functions/tool2.jsstandalone-functions/tool3.js

但我只有一个package.json。所以我成功链接了一个。但是有没有办法也可以链接其他人,或者我必须有单独的项目,package.json每个项目都有单独的 s?

0 投票
1 回答
224 浏览

node.js - 如何 npm-link 其他项目

我正在尝试编写一个库模块,最终应该由其他模块导入,就像 material-ui 或 react-query 一样。

我目前的设置是这样的:

请注意,消费者现在是一个应用程序,但 lib 应该被不止一个其他应用程序使用。

目前,为了举例,两者都只是一个“你好,世界!”,我正试图让这条线import myLib from 'lib'consumer/src/App.jsx.

我得到的是:

我努力了:

  • 看看它是如何在create-react-library中完成的,但他们在他们的示例应用程序 package.json 中使用了对周围项目的直接引用。见这里。这意味着我的应用程序只能包含其中一个库,这有点违背了拥有模块的想法。

  • 使用npm 链接,但遇到了此处描述的相同问题。上面的描述实际上是我试图复制他的方式。这是我得到一些工作的结束。

  • 修补 webpack 配置,并拥有reactpeerDependency 或 devDependency,但没有真正的运气。但我对此一无所知,所以这更像是一次试错,同时希望它是偶然的,或者给出一个好的错误信息。

我真正想要的:

只是一种拥有一个库的方法,我可以通过 随意包含import myStuff from 'myLibrary'它,而无需将其推送到 npm(公司政策禁止这样做)。

0 投票
3 回答
5037 浏览

node.js - npm-link 库上的无效挂钩调用

问题描述:

  • 我目前正在创作一个名为eformless

  • 我使用CRA创建了一个名为 的目录sandbox,我在其中链接了包。

  • 在尝试使用我正在尝试测试的链接包启动沙盒反应应用程序时,我不断收到以下错误:

错误:无效的挂钩调用。钩子只能在函数组件的主体内部调用。这可能由于以下原因之一而发生:

  1. 你可能有不匹配的 React 版本和渲染器(例如 React DOM)
  2. 您可能违反了 Hooks 规则
  3. 您可能在同一个应用程序中拥有多个 React 副本请参阅由于 stackoverflow ToS 导致的更改链接,以获取有关如何调试和修复此问题的提示。

出现问题的地方:

这个问题似乎指向我的库,在那里我编写了一个自定义钩子,它使用从 React 导入的钩子。
这是我的代码中有问题的摘录:

我的设置相当正常,似乎在其他项目中运行良好:

  • 首先我通过捆绑我的图书馆rollup -c
  • eformless通过在我的库文件夹中创建一个链接npm link
  • 并通过在我的sandbox文件夹中创建符号链接npm link eformless

我尝试了什么:

我自然地尝试通过错误消息中提供的链接解决问题。链接您自己的库时,这似乎是一个问题,如此处所述

当您使用 npm link 或等效项时,也会出现此问题。在这种情况下,你的打包器可能会“看到”两个 React——一个在应用程序文件夹中,一个在你的库文件夹中。假设 myapp 和 mylib 是同级文件夹,一种可能的解决方法是从 mylib 运行 npm link ../myapp/node_modules/react。这应该使库使用应用程序的 React 副本。

我确实npm link ../sandbox/node_modules/react在我的eformless文件夹中运行了,但这似乎没有帮助,即使在关闭节点服务器并重新编译之后也是如此。

无论哪种方式,我都觉得很困惑,因为 runnignnpm ls react只显示一个版本的 react 并且它应该是有效的,因为在useState自定义钩子中使用了顶层。

重现问题

两个存储库都是公开的

0 投票
0 回答
293 浏览

npm - 使用 npm 链接返回错误“未找到 - GET https://registry.npmjs.org/”

我正在尝试将 scss 样式的本地依赖项链接到使用npm link. 按照我在依赖项目录中运行的文档,它告诉我:npm link

/usr/local/lib/node_modules/xxx/xyz -> /xxx/xxx/xxx/xxx/xxx/xyz

我进入我的项目目录并运行npm link xyz,但它给出了错误:

npm 错误!404 未找到 - 获取https://registry.npmjs.org/xyz - 未找到

所以它没有找到符号链接并搜索 npm。

我已经读过这可能是由于使用nvm不同版本的节点造成的,但对我来说并非如此。

如何成功链接包?

0 投票
1 回答
44 浏览

npm - 在链接到另一个具有更新版本的本地包后从 npm 安装包

我确定其他人也有这个工作流程,所以我一定在这里遗漏了一些东西。

如何开发新版本的包,将其链接到另一个应用程序中进行测试,然后安装另一个(不相关的)包?

我做了什么:

  1. 运行git clone git@package-to-update && cd package-to-update
  2. 编辑包,更新package-to-update/package.json版本为2.0.0.
  3. 更新my-app/package.json使用package-to-update@2.0.0
  4. cd package-to-update && npm link && cd my-appp && npm link package-to-update.
  5. 测试一下my-app,看看package-to-update@2.0.0问题解决了,来个小聚会。
  6. 推送到package-to-update上游,创建合并请求,并等待维护者合并我的更改。
  7. 同时使用我的本地链接版本,因为它是我正在开发的功能所必需的。
  8. 注意我需要另一个包other-unrelated-packagemy-app
  9. 运行cd my-app && npm install other-unrelated-package
  10. NPM 失败是因为它试图拉取package-to-update@2.0.0尚未发布的内容。
  11. 哭。

每次您想要运行以下过程的唯一选择是npm install

  1. package-to-update中降级my-app/package.json
  2. 运行npm install other-package
  3. 运行npm link package-to-update
  4. package-to-updatemy-app/package.json.
0 投票
1 回答
224 浏览

node.js - 从不同文件夹执行节点 cli 应用程序时,dontenv(npm 模块)不加载正确的 .env 文件

我正在构建一个节点 CLI 应用程序,它使用 dontenv 加载一些环境变量以连接到 mysql 数据库。

我用了

npm link

命令链接到全局并从任何地方运行 CLI 应用程序。我面临的问题是 .env 文件只有在我从 .env 所在的文件夹运行时才会加载。

在此处输入图像描述

然后如果从不同的文件夹运行相同的命令......我得到了错误,这个错误是因为 dontenv 没有正确加载 .env 文件

在此处输入图像描述

顺便说一句,这就是我阅读 .env 的方式,没什么特别的(据我所知)

config.js中

然后我有一个 index.js(package.json 中的主要入口点),它调用我拥有的 process.js

这就是我的问题:((任何帮助将不胜感激)

0 投票
0 回答
162 浏览

node.js - 为什么使用纱线链接时未解决未满足的对等依赖关系?

我有 2 个节点包:foo-servicefoo-commons.

foo-commons是 的依赖项foo-service

在开发过程中,每次发生变化时foo-commons,为了使用它们,foo-service我将编译的源代码从复制foo-commonsfoo-service/node_modules/foo-commons/

我最近遇到了一种更好的方法,即使用yarn link. 关联

yarn link./foo-service/node_modules/foo-commons从to创建一个符号链接./foo-commons/

有了这个,打字稿构建成功,而无需像以前那样手动复制文件。

但是,当我运行时foo-service,我得到一个找不到模块的错误:

此错误仅在我使用yarn link.

错误中的模块mongoose是未解决的对等依赖项foo-commons

为什么使用时未解决未满足的对等依赖关系 yarn link

0 投票
1 回答
242 浏览

reactjs - 如何在使用 create-react-app 构建的应用程序中导入库的本地副本

我有一个我正在写的图书馆。我的库是使用汇总构建的。

我想将它包含在我的主应用程序中。该应用程序是使用 create-react-app 构建的。

我想在应用程序中使用库的开发版本而不将其发布到 npm 注册表。发布和使用变得更加痛苦。(即使使用 local-npm 之类的本地存储库),因为一个版本只能发布一次。我已经看到这里提供的 hack -在私有 NPM 中使用 SNAPSHOT,就像在 Maven 中一样

我尝试使用npm link. 显然,如果实际路径在基本文件夹之外,即使存在符号链接,CRA 也不会使用 dep。

处理这种情况的最佳方法是什么?我想将此作为我未来所有应用程序工作的先例,并正在寻找我可以坚持的解决方案和最佳实践。