How to update bower.json with installed packages? - javascript

In my project I've installed bower components without save option. Now, I would like update to bower.json?
How can I update bower.json with installed packages?

Just list your dependencies:
bower list
Then you should run all install command with param '--save' like this:
bower install bootstrap --save
It's a hard work, but if you have a thousand dependencies, could you create a script to automatize the task.

A little trick if you don't want to write a script for that:
before doing anything rename your bower.json in bower2.json for example.
then you can do a:
$ bower init
(automatically create a bower.json file).
note that all questions should be pre-filled with your current config.
When it will ask you:
set currently installed components as dependencies?
say yes,
You now have all your dependencies in the new bower.json file (and you can check if everything is right with the old bower2.json)

A bit arduous way is to run bower list, look for packages labeled extraneous and add those manually to the dependencies in the bower.json.
If there are a lot of extraneous packages, it might be easier to workaround this by running bower init and answering Yes to "set currently installed components as dependencies?". This will take your current bower.json, read it and then create new one using information from the old one. So in an ideal case you will have the same file just with extraneous packages added.
Warning: Firstly, there might be something lost in the process (e.g. devDependecies). Secondly in the last version of bower (v1.2.7) this will not preserve current packages info! I feel it is a bug. However you can save the old file and (manually) merge it with the generated one.
Also, you should ask for an option or something by opening a bower issue as this would be welcomed by many developers.

You can use bower-check-updates (you need installed node.js on your machine):
bower-check-updates is a utility that automatically adjusts a bower.json with the latest version of all dependencies
bower-check-updates - is a fork of npm-check-updates, so it's all the same but updates bower.json, instead of package.json
npm install -g bower-check-updates
bower-check-updates -u
bower install
This will install bower-check-updates globally, so you can launch it from anywhere.
P.S. for more information about npm-check-updates pleas see this topic

If there aren't that many bower packages you have installed, try writing bower install [package_name] --save. This will just update your bower.json file.

After bower-check-updates -u you must run bower install instead of npm install

Related

How do I stop the prettier dependency in node_modules overriding the project .prettierrc?

In the node_modules folder there is a prettier install (package.json says "version": "1.19.1",) that is overriding the .prettierrc in my project root.
When I delete that dir, formatting returns to normal.
But this is only temporary as npm i puts it back. Something has it as a dependency, even tho searching for "prettier" or 1.19.1 only returns the package-lock.json.
I have other projects that work correctly without a node_modules installation of prettier, but this github template had it.
How can I clear this up? Ideally, I want to only use the project level .prettierrc.
You can find out which package is the culprit by searching in your package-lock.json. Each package in there has a requires field which lists its dependencies. That way you can traverse the chain to find out which dependency is causing the install.
Once you found the package, you have several options to force a specific dependency. In your case, you would force the latest version of prettier-plugin-svelte to be installed. In your case it's probably best to use npm shrinkwrap. You first add the latest version of prettier-plugin-svelte to your package.json, then do npm i, then make sure that only the latest prettier-plugin-svelte appears in your node_modules, then run npm shrinkwrap. More info here: https://nodejs.org/en/blog/npm/managing-node-js-dependencies-with-shrinkwrap/
More info and alternatives on forcing versions for various tools (npm/yarn) can be found in this StackOverflow answer: How do I override nested NPM dependency versions?

how to change the code of other modules in nodejs

For example.I installed a module in the node_modules. if i change that module, updating node_module will update all modules.What is the usual practice
Look into patch-package
In summary, you install the package and add a postinstall script to your package.json file that calls patch-package:
"scripts": {
"postinstall": "patch-package"
}
Modify the package directly in /node_modules and then call patch-package on the package you just modified:
npx patch-package <package_name>
This will create a local directory called /patches with a diff (or patch) file inside for that package. Commit that folder in with your repo.
Now whenever you run npm install, the postinstall script will also run and apply the /patches that you committed to that package 🙌🏽
First, We call it Package instead of Module, Why? because search results on Google are much more accurate when you use that word
Second, to update a specific package use npm update {package name}
Third, you don't change the code of other packages, you can only either install, update, or delete the package. there's this option to override it but it's only possible if the package owner allows overrides.
Update
I decided to update my answer due to the discussion below.
since I have put in mind that you are a beginner and are not entirely sure how to update code or override package code, or maybe even if it's a good idea to change package code, I have given you an unclear answer.
and since the other answer are telling you to use patch-package
then I'm here to tell you that you can fork that package. and install that package from your fork. here's how you do it

Node.js project with no package.json

Is it ok to have a node.js project with no package.json? The ones I see on the internet all come with package.json
What is the effect of having no package.json?
How is package.json created in the first place? Is it created automatically? I am wondering why I do not have package.json
Fundamentally, package.json is a meta file for your application. It lists all the configuration of your application.
What is the effect of having no package.json?
Nothing as far as you're running all your code locally and have no requirement for deployment whatsoever.
Let's setup a scene for you to understand this better.
Imagine that you wrote a brilliant application using node. Now all the chicks in your surrounding want it to play with. It is so fantastic!
Now you want to give it to them and during the development process you `npm install`ed so many things that your project grows beyond 4TB size.
There is no data storage device available to ship that huge code base.
Then the girl of your dream said I want it and I want it now. So you begin searching for app deployment process for node applications.
That is where you stumble upon a magical thing called package.json.
So what you do is you list all your npm installed modules under dependencies property. Then you delete node_modulesfolder, add package.json and commit the entire damn thing in github. Even the .zip file is of 10MB
Then she gets the code.
Types in npm install && npm start (which will install all the dependencies from the package.json` and start your application)
If you have package.json however, that is where you specify all your dependencies.
Using --save flag of npm install
Example.
npm install express --save
How is package.json created in the first place? Is it created automatically?
You can manually create a text file and save it as package.json
OR
A more sophisticated way is to use the command
npm init
I am wondering why I do not have package.json
Me too! :)
You're most probably following a tutorial that doesn't emphasize on initial configuration of the project OR the author of those tutorials presume that the reader has all the fundamentals down to begin with.
It is created automatically if you write npm init.
Then, every package you add using npm install packagename --save will be added to the dependencies list.
You need package.json so that when you want to use your project on another machine you don't have to copy all node_modules, but only your .js files you have written, assets and package.json. You can then run npm install command and it will automatically download and install all the required modules (found in the list of dependencies inside package.json).
You can also manually create or edit it, but it's easier to add --save when installing a module so you don't have to worry about package versions and stuff like that.
Also if you want to create a npm package, an open source project or stuff other people will use, it's either required or the norm to have this package.json file describing your project.
package.json is npm file, if you don't use npm you will not have this file, npm is a great tool if you want to use external libraries in your project but if you don't need it (which is very not likely unless you are doing something very simple), you don't need package.json file too.
To generate package.json file initialize npm in your project using npm init
possible reason thus it exist is you maybe you enter a wrong command like npm i -y, you must initialize the project first, just enter a command npm init -y
Welcome.
Well, if you are running it on your local machine, it's fine. now to answer your last question, package.json is not created automatically.
the npm command npm init -y creates the 'package.json' file. It basically makes sharing your code and installing your codebase easier.

Generate bower file automatically?

In current project I have pretty big bower file. Many dependencies are out of dated and have hardcoded version like ~1.2. I have replaced it with "latest" and run bower install/update and everything went ok.
The problem is that I don't want to have such settings like "latest" on production server. What is the easiest way to grab current versions of bower components and put it to the bower file? aka generate bower file from existing dependencies.
Using bower init, you'll be able to regenerate from scratch your bower.json file with all the current dependencies
With bower install --save jquery#<version_number> you can install specific versions of bower components, e.g.
bower install --save jquery#1.10.2
the --save automatically adds the dependency to bower.json. Normally there is no need to edit bower.json manually.

How to stop Bower pulling more than I need?

I've only just started using Bower, so I'm likely doing it wrong. However, when I pull down jQuery through bower using this:
bower install jQuery#1.9.1
I get a folder which is about 700k in size. The only thing I need in that folder however is the jquery.js or jquery.min.js, which are 239k, and 82k respectively.
As far as I understand it, this is because bower simply pulls down everything that's in the Github repository whether it's needed or not.
Is there any way to stop this? So that bower only pulls down what is needed to develop? Or Am I misunderstanding how I should be using Bower?
Thanks.
You're using it correctly. You should have a bower.json file with all of your dependencies specified so that you don't have to include bower's plugin directory with your source code, then just run bower install from a new machine to get the dependencies.
When you install a plugin and want your bower.json automatically updated, run bower install mydependency --save.

Categories

Resources