I'm sure others have this workflow, so I must be missing something here.
How does one go about developing a new version of a package, linking it to test in another app, and then installing another (unrelated) package?
What I've done:
Run git clone git#package-to-update && cd package-to-update.
Edit package, update package-to-update/package.json version to 2.0.0.
Update my-app/package.json to use package-to-update#2.0.0.
cd package-to-update && npm link && cd my-appp && npm link package-to-update.
Test out my-app, see that package-to-update#2.0.0 resolves the issue, have a small party.
Push to package-to-update's upstream, create a merge request, and wait for maintainers to merge in my changes.
Use my local, linked version in the meantime as it's required for the feature I'm working on.
Notice I need another package other-unrelated-package in my-app.
Run cd my-app && npm install other-unrelated-package.
NPM fails because it's trying to pull package-to-update#2.0.0, which is not yet published.
Cry.
Is the only option here to run the following process every time you want to npm install?
Downgrade package-to-update in my-app/package.json.
Run npm install other-package.
Run npm link package-to-update.
Upgrade package-to-update in my-app/package.json".
I generally only use npm link for development. If I want to use a local version and not have to deal with re-linking, I install it by path rather than by version.
npm install /file/path/to/your/module
Then you'll end up with a file: URL like this in your package.json:
"slug": "file:../../slug"
Subsequent npm install won't search the registry in that case. (Since it will avoid the registry on future npm install runs, it also means you need to remember to change it back to the registry when the version with your patch is released!)
I haven't tested, but this method may require that you only care about it as an immediate dependency and not a dependency of another dependency. Based on your workflow above, that seems to be the case, but mentioning it here for other folks.
Related
I have a project that I'm working on for a client where I have two private packages (which I can't get access to npm install) are inside the package.json.
I do however have access to clone the repos for those said packages. If I simply run an npm install I'll get a permission denied error. Same if I run npm link to the packages.
I've been working around this by removing the packages from the package.json then running npm install ../some-package. This works but isn't a great solution because if I wanted to add a new package I'd have to deal with a bit of a mess with the package.json.
Is there a better way than this?
I have tried running npm link ../some-package but I still get access denied. The only way I've managed to complete an install is by removing the packages then installing them from a local dir.
I don't know the details of your situation, but I see at least two potential solutions to explore.
Option 1: Install the package from the repo
I do however have access to clone the repos for those said packages.
You can install from a git repo and package.json will record that git repo as the source of the package rather than the npm registry.
From the docs at https://docs.npmjs.com/cli/v8/commands/npm-install:
npm install :
Installs the package from the hosted git provider, cloning it with git. For a full git remote url, only that URL will be attempted.
Option 2: Install from the local file system with --no-save
If that approach doesn't work for you, you can try npm install --no-save ../some-package as a build step. The --no-save makes it so it doesn't modify package.json.
I'm trying to run a simple hello.ts script from command line. This works if the script has no dependencies:
npx ts-node hello.ts
But as soon as I start adding some dependencies...
import _ from 'lodash';
console.log('hello');
It fails:
Cannot find module 'lodash' or its corresponding type declarations.
It keeps failing even if I install the dependencies globally. So how do I tell npx (or ts-node for that matter) to consider globally installed dependencies?
Update
Using Node 16.9.1 (upgraded via Version Lens). The error seems to have disappeared after uninstalling/reinstalling the imported libraries a few times.
If you're using npm >=1.0, you can use npm link to create a local link to a package already installed globally. (Caveat: The OS must support symlinks.)
IE: npm install -g lodash && npm link lodash
However, this doesn't come without its problems.
npm link is a development tool. It's awesome for managing packages on your local development box. But deploying with npm link is basically asking for problems, since it makes it super easy to update things without realizing it.
As an alternative, you can install the packages locally as well as globally.
For additional information, see:
https://nodejs.org/en/blog/npm/npm-1-0-link/
https://nodejs.org/en/blog/npm/npm-1-0-global-vs-local-installation/
Are you using the n package by any chance? I used n to change from a newer version of node (16.2.0) to an older version of node (12.13.0), ran npm i and npx failed with a different error.
Using n to change back to 16.2.0 seems to have resolved the issue so I'm thinking perhaps it was an issue with package-lock.json or such
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
I have installed a third party library in my project but it is not working , so I want to delete that library from my project ,
How can I do that ?
If it is a library based only on javascript, than you can just run npm uninstall --save package_name or npm uninstall --save-dev package_name
If you've installed a library with native content that requires linking, and you've linked it with rnpm then you can do: rnpm unlink package_name then follow step 1
If you've installed a library with native content manually, then just undo all the steps you took to add the library in the first place. Then follow step 1.
note rnpm as is deprecated
I followed the following steps:--
react-native unlink <lib name> -- this command has done the unlinking of the library from both platforms.
react-native uninstall <lib name> -- this has uninstalled the library from the node modules and its dependencies
Manually removed the library name from package.json -- somehow the --save command was not working for me to remove the library declaration from package.json.
After this I have manually deleted the empty react-native library from the node_modules folder
If you want to unlink already installed packages in react native
$ react-native unlink package_name
$ yarn remove package_name (if it is npm then npm uninstall --save)
If you execute 2nd step before 1st step you need to install relevant package back and execute 2nd step
I will post my answer here since it's the first result in google's search
1) react-native unlink <Module Name>
2) npm unlink <Module Name>
3) npm uninstall --save <Module name
From react-native --help
uninstall [options] uninstall and unlink native dependencies
Ex:
react-native uninstall react-native-vector-icons
It will uninstall and unlink its dependencies.
You can delete installed react native package with this command.
npm uninstall package_name
example:
npm uninstall react-native-camera
remove package name from package.json file
delete package-lock.json file
then run npm install
or you can run the following command to uninstall any package
npm uninstall package_name
you have to check your linked project, in the new version of RN, don't need to link if you linked it cause a problem,
I Fixed the problem by unlinked manually the dependency that I linked and re-run.
For iOS...
Remove the node package and install the pods.
If you're using npm:
npm uninstall package-name
If you're using yarn:
yarn remove package-name
Then simply install pods with:
npx pod-install
Typically the package.json directory is in the root of your project folder, so you should run these from there. npx pod-install will go to your ios folder and will run pod install. You do not need to run this step if you are not adding/removing native components.
I think for Android it might be the same steps, but without running the latter command since Android does not use cocoapods.
Simple and easy solution.
npm uninstall --save react-native-image-slider-box
All of the top answers are a bit outdated. They do work, but the process could be better. So I'm going to post a more modern and 'normal' way.
Assumptions:
Your project is not overly old, meaning that your project is not using react-native version <0.60 (less than 0.60). This is because in the past (when you had react-native version <0.60), you had to manually run commands like react-native unlink when you wanted to uninstall a package. Those commands still work but are no longer necessary.
The library/package works with autolinking or it doesn't need linking at all because the package doesn't use native code. If the package's installation instructions don't require you to run a command to link the package (e.g. react-native link), then it uses autolinking or it doesn't need linking at all. A package might suggest you run the link command but they'll also usually say it's not required if your project's react-native is version >=0.60. The majority of libraries are like this now. I'd be surprised if the package you want to uninstall uses native code but doesn't support autolinking. Read more about autolinking.
If the package you want to uninstall doesn't use native code, then the above paragraph about autolinking doesn't matter.
You of course remembered to remove any use of the package in your project, before you try to uninstall it.
You've checked if other packages require the package you want to delete as a peer dependency. In this case, you removing that dependency can cause your other packages to not work.
If your package was installed without any manual editing of native files (e.g. android/settings.gradle, ios/yourappname/AppDelegate.m, etc.) or any other configuration (e.g. mypackage.config.js), then you should just do this:
If using npm, run npm uninstall <yourpackage>. If using yarn, run yarn remove <yourpackage>.
(React native uses autolinking to unlink the packages automatically so this is all you should need to do to 'unlink'. Read more.)
Run cd ios && pod install && cd ..
You can skip this step if you're absolutely sure that the package is purely written in JavaScript/Typescript. My opinion is to just run it anyway so that way your brain doesn't have to spend energy thinking/worrying about this.
That's it. You're good to go. If you're not good to go here, then something is very wrong.
If you did have to manually edit native files or any other extra configuration to install your package, then:
It's a good idea to get all the info you can on what you exactly did when you installed the package. Any additional context you can learn is good.
You should look at your git history to see the changes you did when you installed the package.
It's a good idea to read the package's README or docs to remind you of anything else you might have forgotten.
In addition to the package's most up-to-date README or docs, it's a good idea to try to read the package's README/docs from the exact version that you're trying to uninstall. If you just read the README from the package's main github page, for example, then the info might be too new.
Undo the manual changes you did when installing the package. Ideally, use git diff or a git GUI program to help you out with this. Because this process varies depending on the package and what you actually did, it's hard to be more specific than that.
If using npm, run npm uninstall <yourpackage>. If using yarn, run yarn remove <yourpackage>.
(React native uses autolinking to unlink the packages automatically so this is all you should need to do to 'unlink'. Read more.)
Run cd ios && pod install && cd ..
You can skip this step if you're absolutely sure that the package is purely written in JavaScript/Typescript. My opinion is to just run it anyway so that way your brain doesn't have to spend energy thinking/worrying about this.
That's it, done. If things are not good at this point, then something is very wrong.
Remember to upvote if you feel this helped you, so it can be more visible. Thanks!
Uninstalling local packages:
npm uninstall <package_name>
for example:
npm uninstall react-native-webview
Uninstalling global packages:
npm uninstall -g <package_name>
for example:
npm uninstall -g react-native-webview
I want to be able to compare my locally installed packages against my project package.json file without making a call against the npm online repo. If there is a package that is out of date based on the package.json file, then and only then will it go to the npm online repo and install the package.
The reason for this is that I want to be able to update the package.json file to require a newer version of a package, commit this change to the project repo and when other developers on the team get latest their npm package is updated. I do not want to slow down the process if everything is up-to-date or cause the build to fail if access to the npm repo or the internet is down.
I am wondering if this is an already solved use-case or do I need to parse the package.json file and compare it to a "npm ls" output myself?
you will need to setup a local repository (by duplicating the NPM couchdb localy)
( see https://stackoverflow.com/a/7577265/406458)
then you could use npm-check-updates.
npm-check-updates will give you a list of packages that can be updated in your package.json file see
https://www.npmjs.org/package/npm-check-updates
$ npm-check-updates
"connect" can be updated from 2.8.x to 2.11.x (Installed: 2.8.8,
Latest: 2.11.0) "commander" can be updated from 1.3.x to 2.0.x
(Installed: 1.3.2, Latest: 2.0.0)
Run 'npm-check-updates -u' to upgrade your package.json automatically
Check global npm packages for updates:
$ npm-check-updates -u