时间戳

首页 > 解决方案 > 将代码打包为库后开发人员的人体工程学损失

npm - 将代码打包为库后开发人员的人体工程学损失

问题描述

我制作了一些使用非常相似的图表代码的应用程序（使用 webpack、babel、react、d3、npm 等）。我正在将该图表代码拆分为一个 npm 包，然后多个应用程序可以导入该包。

为了测试这一点，我在我的图表库项目目录中嵌入了一个演示应用程序，并将库安装在其文件路径中。现在，大概我可以在依赖的应用程序中安装它A，B等等C，我可以更改我的图表库，所有应用程序都会反映这些更改。

我注意到的第一件事是，我现在必须在我更改某些内容时cd进入我的图表库并运行npm run build（运行 webpack），然后cd进入我正在开发的依赖应用程序并运行npm i。这也许可以通过使用来改进，npm link但也存在问题（例如版本控制和部署到我的服务器）。所以我的第一个问题是，既然我的图表代码位于一个单独的 npm 项目中，那么一种体面的快速开发方法是什么样的。

我注意到的另一个问题是我的图表库代码丢失了两个有价值的功能。VSCode 中的代码完成和 chrome 开发工具中的调试。我不确定为什么 VSCode 代码完成停止工作。对于调试，我如何能够在 chrome 中同时调试我的依赖应用程序和它依赖的库？

标签： npmwebpackvisual-studio-code

解决方案

我会用npm link. 在同时处理库及其集成时，它非常有帮助。

检查 Chrome 设置以确保没有指示跳过Settings->中的库Framework Blackboxing，请参见例如http://blog.edenhauser.com/tell-chrome-debugger-to-ignore-libraries/。

推荐阅读