To make development easier it's possible to specify local NPM dependency:
{
"dependencies": {
"mylib": "file:/projects/mylib"
}
}
The problem is that you required to do npm install and the mylib will be COPIED to the node_modules. So if you change mylib you need to run npm install again.
I wonder if there's a way to do the same but as a link not as a copy, so it will be the live version of the package and any change would be instantly visible?
To avoid using the npm link command, which works creating a symlink in the global npm folder, you can try using the npm-file-link package. It works modifying the original dependency by one to the local package using the "file:" npm feature, and you can link or unlink at a time all packages you want, whenever they are all under the same folder.
Related
I'm working on a vue.js frontend, and I need to patch a package to fit the special needs of the app. The package I'm trying to patch is 'vue-youtube' (not that it really matters). I'm trying to patch it with patch-package (https://www.npmjs.com/package/patch-package)
So basically :
I edited locally the /node_modules/vue-youtube/src/vue-youtube.js to fit my needs
I did add the postinstall script in my package.json : "scripts": { "postinstall": "patch-package" }
I did npm install patch-package --save-dev
Then I ran npx patch-package vue-youtube
It did create a vue-youtube+1.4.0.patch file in a /patches folder with my modifications
BUT, my modifications are not seen. When I do npm run serve and launch my webapp, the package used is still the one not edited. I tried running npm install before, without success. When I go to the /node_modules/vue-youtube/dist/vue-youtube.js (thankfully it is a small package so it is readable), I can see that indeed my modifications have not been "compiled".
What am I missing here ? I feel like I have followed eveything in the patch-package npm page..
Thanks
EDIT : Still investigating.. few more informations/questions :
my patch name is patches/vue-youtube+1.4.0.patch
when i run npm ls vue-youtube it returns just one element : vue-youtube#1.4.0
in my package.json the dependency listed is "vue-youtube": "^1.4.0", should it be different ? should it mention that it needs to be patched ?
EDIT 2 : I realized that I am not editing the node_modules/vue-youtube/dist/vue-youtube.js, but the node_modules/vue-youtube/src/vue-youtube.
If you edit the files in the dist folder, the patch works. (however I thought patch-package would allow me to edit the files in the src folder, in readable JS...)
WORKING SOLUTION :
If you edit the files directly in the dist/ folder of the package instead of the src/ folder, the patch works fine.
Adding below npm script in package.json after patching worked for me.
scripts: {
"prepare": "patch-package",
}
The lines from yarn documentation explains about prepare
For compatibility reasons, scripts called install, postinstall, prepublish, and prepare will all be called after your package has finished installing.
After adding this script in package.json, the changes of module file in patches folder has been patched into respective node module.
I was trying to do the exact same thing with some package, let's call it "some_package". When I saw the EDIT 2 my mind just connected the dots...
To test changes locally
Modify the files in node_modules/some_package/src folder and then, go to the node_modules/some_package and run:
$ npm install
$ npm run <name of the script that generates the dist folder>
No need to run npx patch-package nor postinstall step.
I think that this approach doesn't work for all packages, it depends on how the modified package's package.json is configured. Specifically, pay attention where the browser field is pointing (in my case ./dist/some_package.js).
CAVEAT: You will have to run npm install and npm run every time you make an update to the package.
To test changes and be able to share it among team members (when the package is on Github)
Make a fork of the package you want to modify.
Make all the changes you want to your forked version of the package.
Run the following to automatically update the package.json file to make the dependency point to your forked version:
$ npm install <github's user name>/<package's name of the forked repository>#<branch name> --save-prod
For instance, if your Github's user name is "johndoe", and you forked https://github.com/aurelia/framework, and you made a branch named "mycoolbranch" containing your changes, then it would be:
$ npm install johndoe/aurelia-framework#mycoolbranch --save-prod
Note that the --save-prod flag could be replaced with --save-dev if the dependency is just for development.
Take a look at this answer, it may help.
https://stackoverflow.com/a/71153240/9981565
For me it was happening because of version mismatch between package.json intended version of package and yarn.lock / package-lock.json
What happens differently when you go into your package.json and paste a package name in and do npm i vs. doing it the real npm i package-name?
package.json:
"dep": 1.0.0
vs
npm i dep --save
We have a build error and learned can bypass it by pasting. I know it isn't kosher but I really want to know why and what consequences that causes?
npm install dep doesn't add the dependency to the package.json file.
You have to add --save or --save-dev to add it to the package.json file.
Besides that, npm install will always serve you the latest build (in most cases the version tagged as latest (see npm docs)), unless you specify a specific version.
If you want your lock file to update, you have to delete the file before running npm install to generate a lock file with the dependency included (for more info check out this GitHub issue)
In conclussion it shouldn't make much of a difference if you manually add the dependency to package.json file and install it with npm install, unless the latest version of your dependency is broken.
I use custom built library and then link them between other libraries using 'npm link'. One problem is that,
if I do 'npm install' the links disappear and then I will have to go manually and do the linking.
In order to solve this issue, I am thinking of building a script to do npm link across libraries wherever needed but I am not sure if that will work because we will have to do npm link on the exact path from command line instead of running from a common path from command line.
Example:
I have built a library called, #mycustomlib/ui-components and I use them in other projects.
In order for me to use it, I would have to do the link in the appropriate project folder else I wouldnt be able to import.
Any npm link you've set up will be overwritten when you npm install.
One option to avoid having to relink every time you npm install might be to create a new script in package.json like this:
"scripts": {
"install-local": "npm install && npm link #mycustomlib/ui-components"
}
Then just run npm run install-local.
I have 2 projects(packages) in npm, I want to inject package_A as dependency to package_B. In package_A root folder, I run npm install -g, then npm install it to C:\Users\Myuser\AppData\Roaming\npm\node_moduls\package_A folder. Now in packages.json in package_B I add "package_A": "1.0.0" in dependencies. When in package_B root file I run npm install, its failed package_A#1.0.0 not found.
How can I identified npm to its my own local package?
Notes:
We are a team, then I don't want to address package_A explicitly.
We are using nexus repository manager.
I don't want to publish my projects to http://registry.npmjs.org/.
I'm not 100% clear what you have tried. If you are going to use a custom module for another application you are developing, installing globally won't do the trick. You have to publish that module in npm.
Check this link for more info on publishing in npm
If you have completed the steps correctly, and still no good happens, please check your naming of the module in package.json file.
Instead of typing in the name and version number in package.json file and then npm install, try directly installing in the terminal with --save so that it will automatically be added to package.json file with correct spelling.
I'm building a grunt javascript project with grunt, and I have a package.json file that looks something like:
{
... name, author, etc here ...
"dependencies": {
"grunt-html":"0.2.1"
}
}
I can run npm install to install grunt-html and this works just fine. But when I add new dependencies, all developers on the team must know to run npm install again. Is there a way to automatically install any packages that have not yet been installed? Should I just run npm install always to ensure I'm up to date?
Yes npm install is the easiest way IMO. Getting everyone familiar with the other npm commands makes managing deps easier as well. Such as:
npm ls to list out the currently installed modules.
Or the --save flag ie, npm install grunt-html --save to install and insert the package and version into your package.json.
npm prune to remove modules not included in your package.json.
Other ways to manage dependencies are to commit the node_modules folder in your repository to avoid other devs from having to run npm install. Or for more complex projects consider using npm shrinkwrap to lock down dependencies to specific versions: npm shrinkwrap docs.
I have not tried grunt-install-dependencies (https://github.com/ahutchings/grunt-install-dependencies), but it seems this may fullfill your needs. Just add the command install-dependencies as first task within your custom definfed grunt tasts, e.g.
grunt.registerTask('build', [ 'install-dependencies', 'useminPrepare', ... ]);