If I need to manually custom code from npm module, how should I do it - react-native

In the react-native world I came across using many lib packages, some of them are outdated or not maintained. By going through the issue ticket or google for some solution to some bug, sometime I found a solution but how should I apply it?
I normally just change the code inside node_module directly, but I know this is really bad way cause it not even my git and gonna be lost at some point
what is the proper way to do this?

You can install node modules that aren't in the registry.
See: https://docs.npmjs.com/cli/install
Specifically these two methods are worth a look.
npm install <git-host>:<git-user>/<repo-name>
npm install <git repo url>
If the module in question are hosted on github, clone the repository, apply the patch to it there, and then use the module directly from github.
You could also see if anyone else is maintaining a fork of it.

Related

Does installing a root package automatically install a scoped library?

After I am installing a root library, such as npm install aws-amplify, sometimes it seems that I need to install its sub library such as npm install #aws-amplify/cli. Why did not npm install aws-amplify install every sub library within it?
What's the npm packaging and installing rule here? can someone help me clearing understand that?
You are mixing up 2 different syntaxes. The #namespace/package is relatively new. It used to be just package, and some packages still use this. In the old way package tend to name themselves 'namespace-package' as some sort ofworkaround.
But that is not your question. Your question is 'why do they even do this?'.
Why wouldn't you just download all the npm package out there? Then you have and can use everything, right? As you can imagine this doesn't make much sense, you will only want to download and use what you need. Think of this quote from Joe Armstrong:
You wanted a banana but what you got was a gorilla holding the banana and the entire jungle.
The quote is a entirely out of context since it is more about not using classes, but it still kind of applies to this. At lot of packages will offer you a core package and the option to add sub-packages based on your need. Like in your example, someone might not need #aws-amplify/cli, this way he doesn't have to download it.

How do you modify other's library/ module?

I want to add a Card component to this module: https://snack.expo.io/#xcarpentier/gifted-chat (demo)
For example, if using onLongPress() on the Bubble Message, i want additional info to appear (right below that Bubble Message, as a small card, like Tinder Card).
How do I do that? Do I need to clone the source code and then modify it to fit what I need?
Although you are able to edit the file in your node_modules folder, it is not a great long-term solution. Why not?
The process is not consistent with using other modules
Another npm install will overwrite your changes
Your solution won't be available to someone else wanting to implement that feature
Bad Solution
If you would still like to go this route, the quickest way to go about it would be by linking it via npm. In the event this link is not available anymore, you can link a module following these steps:
In your terminal, navigate to the node module you have modified
Create a global symlink with npm link
Navigate to your app's root directory
Reference that symlink with npm link name-of-module
Again, this is not a permanent solution and should only be used for quickly testing modifications to a module.
Better Solution
Forking the repo is a good way to maintain the commits specific to that module, and you can share your modifications to the open-source community. Some reasons to fork are explained in the Github help wiki, but doing it is pretty straight-forward.
Navigate to the Github repo of the package you are wanting to change
Press the Fork button in the top right corner
npm install git+your-forked-repo-url in your project's root directory (don't forget to npm uninstall the old one)
Now, you can follow the process mentioned in the Bad Solution to locally test out changes to that package. After you're satisfied with them, you can copy those changes over to your forked repo and push them to Github (you'll want bump your version, but you may have some merge conflicts to resolve if you ever want to merge changes with the upstream repo). Then do another npm install of your repo make those changes more permanent in your node_modules folder.
If you would like to stay up-to-date with the repo you forked from, Github explains the process here.
TL;DR
Choose the Better Solution.
I found a solution in this stackoverflow answer which IMO is simpler - using patch-package and does not require forking repositories.

How to make a code branch that does not need `npm install` to work

I have a web app that uses npm to install a big list of dependencies.
I want to make a branch that will...
a) permanently freeze all dependency versions,
b) work when checked out, without having to run npm install (i.e. unable to retrieve libraries from the internet), and
c) allow a developer to fix bugs.
It seems like committing /node_modules to the repo accomplishes this, but I do not have enough knowledge to know that this is really the correct answer in all situations.

Is there a way to ignore a node_module when running npm install

Hi I have made some custom adjustments to a node_module's files to get it to meet client requirements. These changes obviously are not in the packages source code so I want to avoid overwritting them if I need to update npm packages. Is there a way to do this? Maybe something similar to a git ignore?
Modifying a npm package directly is not recommended and could lead to multiple issues, the way to go about this is either contribute your changes to the original source code on GitHub if other would find the code you wrote useful, either that or you could make your own fork of the package and use that as a dependency instead.
You can install your own package by using the tarballs provided by GitHub.
npm install https://github.com/<username>/<repository>/tarball/master

Turn a global into an npm, browserify, etc. module

I've built out this simple library https://github.com/FarhadG/script-tag-data and you can either clone it down or install via bower but I'm curious how I should go about turning it into an npm, browserify, etc. module.
Since you already have your project on github, for publishing to npm, you can follow the guide over here : npm-developers
AFAIK, browserify doesn't have a registry. You probably meant bower. Follow this guide : Creating Packages
And maybe use Google search next time, yeah?