编辑节点模块文件夹中的react npm模块代码

x6h2sr28  于 2023-02-23  发布在  React
关注(0)|答案(6)|浏览(136)

可以在modules文件夹中更改npm模块的代码吗?我认为这不是推荐的做法,还有其他方法可以实现吗?目前,我尝试更改模块目录中的代码,但更改似乎不适用。提前感谢。

t1rydlwq

t1rydlwq1#

当然你可以修改node_modules中包的内容,因为它是一种标准化的格式。但是,你不应该这样做,因为你应该提交你的修改并重新分发它们。
不幸的是,这个问题的解决方案并不简单,这是我过去一直在努力解决的问题。

npm链接

第一种方法是在本地克隆repo,然后使用npm link在项目中使用它。

npm link ../path/to/my/proj

这种方法的缺点是,你仍然需要手动下载仓库来使用它,而npm link会让你的链接版本成为在你的系统上全局使用的包,这可能会产生意想不到的副作用。也就是说,如果你想在本地测试对你的包所做的更改,并将它们贡献给上游,npm link可能是最好的方法。

使用分叉的git存储库

你也可以通过以下操作直接从派生的git repo安装它:

npm install --save $GIT_REPO_URL

但是使用这种方法,你需要有证书来访问git repo,因此当你处理私有repo之类的东西时,特别是在CI环境中,会增加额外的复杂性。另外,你应该包含一个commitish,这样你就可以得到可重复的构建--不使用npm链接来开发它是一件痛苦的事情。You can consult the npm documentation for other install options or for more specifics如果您不必担心上述任何问题,这是一种非常好的方法。

本地npm模块

一旦你做了修改,你也可以像这样把派生的版本安装到你的项目中:

npm install --save ../path/to/my/proj

然而,这样一来,你就可以通过git子模块、git子树或使用monorepo等方式有效地将其他NPM项目作为项目的一部分。这对团队来说可能是一个很好的方法,但对你要做的事情来说可能有些过头了,而且你需要考虑大量的工具来使之成为一个好方法。

发布您自己的npm模块

不幸的是,所有以前的方法都假设软件包要么没有构建过程,要么是用npm's postinstall scripts之类的东西自动构建的,然而,一些npm模块是通过发布一个特定的构建目录来编写的,这使得npm上的内容与源代码有很大的不同。
在这些情况下,你需要把你的构建发布到npm可以安装的地方,包括公共的scoped package,私有的npm仓库,或者把你的npm模块发布到个人的artifact服务器。

gudnpqoy

gudnpqoy2#

您也可以使用修补。

在React Native世界中,这工作得相当可靠--所以我猜它在React世界和许多其他依赖于NPM的世界中也会工作。

修补程序包

是一个可与npm和yarn一起工作的库(注:你可以对本地文件夹node_modules中的库**(也可以是嵌套的)做补丁,或者只对开发依赖项**应用补丁(在生产构建中忽略补丁)。
链接就在这里:https://www.npmjs.com/package/patch-package

1.制作补丁

首先对node_modules文件夹中特定软件包的文件进行更改,然后运行

npm patch-package package-name-where-you-made-changes
// or
// yarn patch-package package-name-where-you-made-changes

如果您尝试修补位于的嵌套软件包,例如node_modules/package/node_modules/another-package,您只需在软件包名称之间添加一个/即可:

npx patch-package package/another-package

它也适用于scoped软件包

npx patch-package @my/package/@my/other-package

2.“/patches”文件夹

如果这是你第一次使用patch-package,它会在你的应用的根目录中创建一个名为patches的文件夹,里面会有一个名为package-name+0.44.0.patch或类似的文件,这是一个普通的旧package-name和你的修正版本之间的Git diff

3.与团队共享修补程序

只需将“patches”文件夹中的文件(patches)提交到repo。

  • 当其他团队成员(或配置项服务)运行npm安装时,修补程序将自动执行(在后台使用npm安装后脚本)-如果要自定义此行为(例如,排除某些修补程序等),请参阅修补程序包官方文档。*

4.提示:

如果软件包托管在Github上(并且你已经登录),你可以运行相同的patch-package命令,并使用**--create-issue**param,这样它会自动创建一个pull请求,并在主存储库中应用补丁(这样维护人员就可以修复这些问题):

npm patch-package package-name-where-you-made-changes --create-issue
// or
// yarn patch-package package-name-where-you-made-changes

5.提示:

要还原修补程序,请使用**--reverse**参数运行该命令:

npm patch-package package-name-where-you-made-changes --reverse
dzjeubhm

dzjeubhm3#

不建议直接在node_modules中修改包,因为当你重新安装包时,你所做的更改将会消失,并且你不能与他人共享你所做的更改。考虑一下,例如在GitHub上派生项目并在那里进行更改,然后将其作为包使用。
如果你只是想试验一下,在node_modules中修改包仍然有效。如果包的package.jsonmain字段指向一个构建文件,你可能需要将这个字段改为源条目文件,或者在源代码中每次更改后自己构建文件。

yzuktlbb

yzuktlbb4#

对我来说,最好的方法是,正如@Kevin Raoofi所说,克隆软件包并发布我自己的,然后将我的下载到一个特定的文件夹中,那里只有"myNpmPackages"。
然后:

  • 在项目中安装克隆
  • 把"*"放进你的json中,以便总是更新pkj
  • 编辑软件包(在"myNpmPackages"文件夹中)
  • 更改版本号
  • 国家预防机制公布
  • 在您项目中,npm安装程序
kmpatx3s

kmpatx3s5#

在我的例子中,我不能接受以上所有的方法,因为我需要做一些小的修改,所以我从node_module文件夹导入了一些必要的类,并在我的源代码树中覆盖了它们。
假设我们需要从安装的node_module中更改类"Computer":电脑。

import
{
    RAM,
    Display,
    HardDisk
} from "computer"

class Computer{
    constructor() {
        this._ram = new RAM();
        this._display = new Display();
        this._hardDisk = new HardDisk();
    }

    ...
}

然后您可以像这样更改,例如在源代码树中。

import
{
    RAM,
    Display,
    HardDisk
} from "computer"

// assume you made additional classes, Keyboard, Mouse 
import {KeyBoard, Mouse} from "./mysourceTree"

class Computer{
    constructor() {
        this._ram = new RAM();
        this._firstDisplay = new Display();
        this._hardDisk = new HardDisk();
        
        
        this._keyBoard = new Keyboard();
        this._mouse = new Mouse();
    }

    ...
}
zkure5ic

zkure5ic6#

我正在使用Vite,想对一个包做一些临时编辑,但没有像预期的那样发生任何事情。
原来Vite做了一些缓存,这对我来说是新的,你必须把--force传递给start命令,让Vite看到你做的任何node_module更新。
从他们的文档中:
如果出于某种原因,您希望强制Vite重新绑定deps,您可以使用--force命令行选项启动dev服务器,或者手动删除node_modules/.vite缓存目录。

相关问题