How to edit a node module installed via npm? - node.js

I'm using the node_swiz module, which in turn uses the validator module.
I want to make changes to the validator module, but I used npm install to install the modules/dependencies.
Can I just make changes to the validator module inside of node_modules, or will that node_modules dependencies be re-created and the latest version gotten when I publish to heroku or next time I run npm install?
The structure looks like this:
myNodeApplication
- node_modules
- swiz
- node_modules
- validator [this is the library I want to edit]
Thanks for the help!

You can edit the file directly, but this would be overwritten whenever npm updates, the best thing to do is go straight to the source.
If the changes affect functionality of the overall module, and may be useful to others, you may want to contribute to the original source on github and look for the change to be implemented.
If this is proprietary functionality that is needed, and would not help the development of the module, the best thing to do is fork it from github and make your changes. You can install items directly from github using NPM, and this method would let you integrate future changes in to your custom version from the original source.
To install directly from github, use the following command:
npm install https://github.com/<username>/<repository>/tarball/<branch>

You can use patch-package to make and persist changes to node modules.
This can be done by first making changes to the package inside node_modules and then running the following command, with <package name> being the name of the package you just made changes to.
npx patch-package <package name>
patch-package will then create a patches folder with a file inside, representing your changes. This file can then be commited to git, and patches can be restored later by running npx patch-package (without any arguments).
Optional step:
Add the following in the script section of your package.json to automatically patch the dependency when you execute "npm install".
"postinstall": "npx patch-package"

I didn't want to publish a new module and I also didn't want npm install to overwrite my changes. I found a solution to both of these issues, but it would probably be better to take #Sdedelbrock's advice. But if you want to do it, here's how:
Edit your package.json file to remove the dependency you want to edit.
Go into your project's /node_modules and move the folder somewhere else in your repository that can be committed. So now /node_modules/dependency is at /dependency
cd into the dependency directory and type npm link
cd into the root of your project directory and type npm link dependency It is important that you do this outside of /node_modules and /dependency
If everything worked, you should now have a symlink that was created in /node_modules/dependency. Now you can run your project to see if it works.

Fork the Github repo and make the necessary changes then you can install the package like
npm install git+https://github.com/visionmedia/express.git

Related

Changing npm module in the node-modules folder

I want to do some changes to an npm-module I already installed in node-modules folder ... I mean edit the code of the locally installed module
My question is ... should I re-run my react-native app with every change I made to see that change in action?
If yes...
I there a better and faster way for testing my changes?
If you change a Module Version in node-modules you have to rerun npm install and then start your app up again.
The app has to be rebuild/restarted beacuse it useses a newer Version of a module.
Normal Code changes not depending the node-modules can be refreshed without rebuilding the app with react natives hot reload.
This is not really an answer but more of a suggestion.
It's better that you don't change it inside the node modules directory if you want to reuse it somewhere else. You will also have trouble dealing with updates.
One way to handle it better maybe to fork the repo of the npm package in GitHub and then modify whatever you have to in that repo. Finally instead of installing that package, install your copy by specifying dependency in package.json like
"module-name": "https://github.com/<your userame>/<module repo>
or you could directly install using:
npm install https://github.com/<your userame>/<module repo>
The URL can be either the https or ssh URL of the repo.
More details on installing packages from Github repo
Also, regarding your question, if you use the above method, you will have to re-run your app after updating the package.

Angular 6 - Remove node_module package and use it in for local project changes

We have decided to go with ng2-smart-table for table grid in our project. But it is not supporting completely what we need to do in our project.
So we have decided to change code on its package level (Files inside to the node_modules directory). So I am not sure how to do it, because if I change something on their package level and if we run npm install command by mistakenly, it will overwrite our changes if they have any updates.
So what do we need to do if I want to made changes in the ng2-smart-table node_modules files. Simply removing entry from the package.json for ng2-smart-table will be good? Or is there any better way to do that?
You've got 2 choices, I expect you will like the first:
(1) use npm patch-package ... https://www.npmjs.com/package/patch-package
You generate a patch for the package in the form of a diff. The patch is saved in your repo. When you npm install, it downloads the normal package and then patches it every time with the diff during a postinstall - postinstall fires automatically AFTER the npm install is complete.
(2) npm install the module you want to change, cd to the directory within node_modules - make the changes including changing the name in package.json then npm publish (all must be done within relevant dir within node_modules) - you have just published your own version of their package. Use that now instead.
In approach (1) I'm not sure how patch package would deal with updates to the original package. In approach (2) you will never get any more updates to the main package since this is now a totally new package which you have published to npm.

Ignore a specific package while installing dependencies using 'npm install'

I have a node package react-native-push-notification for which i have made some changes in the packages to fulfil my requirement. But every time i do a npm install the new (original package without my changes) package overlaps with my current package.
Is there any way i can restrict npm install to ignore my modified package? And also i want to push this package to git.
Any lead will be highly appreciated.
If I understand you correctly you have made some changes to the already existing node package react-native-push-notification and you would rather use your own version of it than the original.
You have a couple of options:
In package.json change react-native-push-notification to point to your git repo (e.g. your fork on github). This is not ideal since it makes semver problematic. But it works.
Rename your fork of the package and use that directly from npm. E.g. rename to react-native-push-notification2 or even better, use a scoped package name e.g. #yournick/react-native-push-notification and publish that to npm. Change your package.json to use this package instead.
Convince the authors of the original package to incorporate your changes. This is the ideal solution, but might be difficult to get your patch merged etc.
patch-package is exactly what you're looking for: https://github.com/ds300/patch-package
It will preserve your changes even after running npm install.
The best way to handle this would be to fork the repo https://help.github.com/articles/fork-a-repo/.
This way, you have control of the contents of the package.
Then update your package.json with your repo address.
I also would recommend not pushing your packages to Git. Packages are already under version control (in their own repo) and pushing to Git just bloats your repo for no reason.
Yes you can do it very easily. Fist of all go to the plugin GitHub repository then fork it to your profile. Before if you want to install this plugin from the direct repo, you have to run this command -
npm i https://github.com/zo0r/react-native-push-notification.git
But after successful fork, it will install the modified files that you have made changes and the command should be -
npm i https://github.com/YourUserName/react-native-push-notification.git
and boom your modified files never will change.

What are the main uses for the NPM package.json file?

I read from here that the dependencies in the package.json file allow people to install the dependencies if they install your project through npm-
Finally, the dependencies field is used to list all the dependencies
of your project that are available on npm. When someone installs your
project through npm, all the dependencies listed will be installed as
well. Additionally, if someone runs npm install in the root directory
of your project, it will install all the dependencies to
./node_modules.
Where will all the dependencies be installed to if someone doesn't run npm install in the root directory of your project?
Also, what if they choose to clone this project through Github instead? It would be ready to go anyway, right? Then at that point what is the purpose of the package.json file besides giving the user meta data about the project?
Where will all the dependencies be installed to if someone doesn't run npm install in the root directory of your project?
If by that you mean 'where will they be installed if you run the command in a different directory', NPM will search upwards through the parent directories until it finds package.json, and then install the dependencies in a node_modules folder next to that file. I.E. they'll always end up in the project root.
Also, what if they choose to clone this project through Github instead? It would be ready to go anyway, right? Then at that point what is the purpose of the package.json file besides giving the user meta data about the project?
This isn't the case! Node projects just about always have a .gitignore file which explicitly excludes node_modules from being committed to version control, and expect you to run npm install after downloading the source.
There's very few good reasons to have your dependencies in your GitHub repository - as long as a project adheres to Semantic Versioning (the vast majority of packages do), npm install will never cause incompatible versions to be downloaded, and if you absolutely need to lock down the versions of your dependencies, you can just use npm shrinkwrap.
EDIT: As Matt's comment very helpfully pointed out, there's several features of NPM that go beyond simple metadata - the one I probably get the most use out of is Scripts, which allow you to create project-specific aliases for command-line operations.
An example of where this has come in handy for me is running the Webpack development server - it's installed locally to my project in the devDependencies (which you can do using the --save-dev option when installing a package), so if I was doing it manually, I would have to type something along the lines of:
"./node_modules/.bin/webpack-dev-server" --inline --hot
Which quite frankly, would be a bit of a pain. Instead, I can just add this to my package.json (note that node_modules/.bin is automatically added to the system path when using an NPM script, so you don't need to type that every time):
"scripts": {
"dev": "webpack-dev-server --inline --hot"
}
And then all I have to run is:
npm run dev
Beyond this simple use-case, there's also several 'special' script names which are automatically called upon certain events - for example, prepublish is run before publishing a package to the registry.
Each Node.js project must contain at least one package.json file, usually located in the root directory of your project. This file identifies the project and lists the packages your project depends on, making your build reproducible.
You can create a package.json file by using a text editor, but the quickest way is to run the npm init command and pass it the -y flag
npm init -y

Using gulp for builds without npm install

I'm working in a web application (JavaScript/C#, version controlled by TFS) and our team wants to start using Visual Studio 2015. Microsoft is moving developers to use existing popular tools like Gulp for automated tasks, so I've written a few Gulp tasks that will run on the server.
My problem is that our automated builds generate new project folders on the build server, so I can't run gulp myBuildTask without first running npm install. The npm install adds over 2 minutes to the build process, and it seems very inefficient to download the same dependencies for every build (since they will change rarely).
Is there anyway I can run a Gulp task on a new project folder without first running npm install?
Options I've considered:
Include node_modules in TFS. I couldn't add the node_modules folder to TFS (which would cause it to exist in each new build folder) because bower's nested dependencies have file paths that are too long for Windows. I could go this route without bower, but I'm not certain I want all those files in my solution (much of which is not needed, like readme's and test files).
Run npm install after each automated build.
As already mentioned, I don't want to do this because it adds several minutes to the build process.
Install NPM modules globally.
I'm not sure if this is even possible, but I'm wondering if I can install all project dependencies globally on the build server (avoiding having to install at the project level). My concern with an approach like this is that I don't want to have to manually update the build server's globally installed NPM modules every time we add a gulp plugin.
Ideally, the solution would be something like #3. The modules would install globally, but every build could run an npm install which would verify every module is installed. If a new npm module was added to the package.json, it would be downloaded. This npm install would be pretty fast since in most cases, all modules would already exist (globally installed on the build server).
There are a few things you might do:
Make npm install run faster. For this purpose, use newest npm (if possible) or use npm dedupe. Running dedupe may result in having less dependencies than with plain npm install. Then run npm shrinkwrap which creates npm-shrinkwrap.json file which contain 'freezed' info about what exactly gets installed (and in which version) during npm install.
Remember, node_modules is just a directory, if you can copy / rsync it to your installation, you can skip the npm install phase altogether
Node package resolution approach is to first try local node_modules directory and if not successful, (node_modules not there or dependency missing in node_modules) check out node_modules of the parent directory, then grandparent directory and so on. This means, you don't have to install packages globally, semi-global installation is quite sufficient
:
my_project
node_modules/
dependency1
dependency2
build_001/
build_002/
build_00x/
no node_modules here,
no deps here
Note however, that this, naturally, works only if your dependencies are really not changing. Since in real life you install something new from time to time, slightly enhanced approach might be helpful: organize your directories as follows:
my_project
ver_af729b
node_modules
build_001
build_002
ver_82b5f3
node_modules
build_003
build_004
af729b and 82b5f3 being (prefixes of) sha hashes of your npm-shrinkwrap.json file. If you then add new dependency, shrinkwrap file gets updated, build script creates new ver_something directory and executes npm install in it. Doing all this would naturally require extra work, but it should work great.
------------------ EDIT -------------------
If you are not trying to avoid npm install completely (you just want it to be quick) you can stick to the typical scenario: you checkout the sources always to the same directory, and let npm install re-use the old node_modules as much as possible.
If you want always to create a new directory for your build, you may still create a node_modules symlink to the older version of node_modules - also in this scenario, npm will reuse as much as possible from symlinked folder.

Resources