javascript - 为什么对节点模块所做的更改不适用于 React.js 应用程序？

Question

我安装了节点模块

npm install

之后，我在其中一个模块中更改了几行。红色矩形中的线是进行更改的地方。

请注意，find命令行工具仅检测一个具有该名称的文件。

然后启动我的反应应用程序：

npm run start

打开 Chrome 的 DevTools 我希望在修改后的文件中看到这些更改，但该文件并未受到任何更改的影响。我的意思是该文件看起来与最初的样子相同。

我清除了所有浏览器的缓存，删除了 node_modules/.cache

rm -fr node_modules/.cache

我重新启动了浏览器，甚至我的电脑。我尝试更改的源库的名称是leaflet. 我已经安装了另一个依赖于该库的模块。leaflet我的 PC 上没有全局 npm 安装：

>:~/Coding/test/react-leaflet-marker$ npm list -g --depth=0
/home/cloud-of-sounds/.nvm/versions/node/v10.13.0/lib
├── @storybook/cli@5.2.6
├── cordova@8.1.1
├── http-server@0.11.1
├── json-minify@1.0.0
├── minify@4.1.3
├── npm@6.4.1
├── phonegap@8.2.2
└── plugman@3.0.1

我无法解决这个问题。你能帮我如何让我的浏览器加载这些更改吗？

标签： javascriptreactjsnpmleafletgoogle-chrome-devtools

Answer 1

谢谢你，@IvanSanchez！我用从 github 克隆node_modules的最新文件夹替换了该文件夹。leaflet我再次进行了这些更改leaflet/src/layer/marker/Icon.Default.js。接下来我跑

npm install

和

npm run rollup

瞧！Chrome 调试器现在可以正确显示代码的修改。

结论：在 npm 包src/文件夹中包含开发阶段代码，而不是dist/包含生产阶段代码！看起来运行npm run rollup构建代码src/并将其输出到dist/.