编辑 npm 库并通过热重载实时查看更改？答案

【问题标题】：Editing a npm library and seeing changes live with hot reloading?编辑 npm 库并通过热重载实时查看更改？
【发布时间】：2018-06-23 16:05:57
【问题描述】：

我正在开发一个 React.js 网站，该网站使用 webpack 和一个模块中的一些共享代码，我也有该模块的源代码。我想对共享库进行一些调整，但目前它是通过 node_module 从 npm 安装的。如何设置我的开发环境以便能够在共享模块上工作，但仍然能够看到我对模块所做的更改并通过热重载实时显示？

【问题讨论】：

标签： node.js reactjs webpack

【解决方案1】：

使用本地依赖，指向包的本地副本：

{   
    "dependencies": {
    "bar": "file:../foo"
}

然后在手表模式下构建foo。

主应用程序会识别出发生了变化并热重载相关部分。

【讨论】：

谢谢！澄清一下，../foo 将是模块目录根目录的相对路径（即包含 package.json 的目录）？所以这个模块最终不会安装在 node_modules 中，而只是父目录或任何该文件：链接指向？
没错。从技术上讲，它会出现在node_modules 下，但这只是一个符号链接。
对于任何想知道如何在手表模式下构建的人，您可以使用 npm-watch。本教程帮助了我：medium.com/how-to-react/…

【解决方案2】：

更新：以下是关于如何使用yarn link的更具描述性的答案：https://stackoverflow.com/a/48688156/2748017

看起来有一个内置的解决方案可以用纱线处理这个问题。

文档： https://yarnpkg.com/cli/link

$> yarn link <destination>

我也相信npm might handle this，只是稍微提升一点。

就热重载而言，我认为这更多取决于应用程序消耗本地依赖项，但 npm-watch 似乎是一个不错的解决方案。

【讨论】：