Why do NPM node modules contain a bower.json file? - npm

I've been tasked with removing bower where possible and instead using NPM to install modules. I've done a search of the codebase and the only bower.json files are within NPM node modules. I thought that NPM was an alternative to bower, is this incorrect?
I was expecting to find a bower.json file in the project root. As I haven't does it should like NPM is already being used instead?

You can use NPM as an alternative to bower, yes.
Every module has a bower.json because the module wants to support bower and npm as well. Module managers can write stuff like version number, ignore certain files to download, etc. You don't need to worry about these files.
Your package doesn't have a bower.json - perfect. You don't support bower.

Related

Install other package.json dependencies

Simple question : Is it possible, in a package.json, to reference another package.json, and install its dependencies ?
Thank you.
Yes, this is possible, and this is automatically done by npm install.
If you have pkg-a that depends on pkg-b, including pkg-a in your dependencies will install both pkg-a and pkg-b when running npm install. That is because dependencies are actually references to the package.json of other packages. NPM, upon running install, builds a dependency tree of all the packages that are indirectly required by your current project, and installs all of them in the node_modules directory, and keeps track of them all in package-lock.json.
Good question! but this is not possible as you cannot internally reference one json document from another (json is just a document format, it lacks any ability to process logic, import files etc), npm is configured to run using a single package.json file so your best best would be to put all your dependencies in a single package.json file or split your project into two directories with two separate package.json files, two npm installs etc, if for some reason you require your dependencies to be separate. You could then run your two node projects separately and connect via http if you wish.
The only way that you could come close to doing this would be to write an npm start script in the package.json that cds to another directory with a package.json and runs npm install, this would however only install the dependencies in the second directory node-modules/ folder

Where to install bulma-start through npm in project

I have created a css folder in my public folder of my project. Is it handy to npm install bulma-start directly in the css folder? Currently project links to Bulma via CDN link but I want to install it on my local machine so the project can run it locally. Can you please recommend the best procedures for installing all dependancies correctly?
Using bulma-start is bit different as compared to working with other npm packages so here are the steps I've followed to work with bulma-start.
Create another folder say temp.
Initiate npm package there by using npm init
Install bulma-start by using npm install bulma-start.
Copy paste all the files inside the node-modules to wherever you want to work with this project.
Again do npm install to install the dependencies of bulma-start i.e. bulma etc.
Feel free to delete temp.
Is it handy to npm install bulma-start directly in the css folder?
bulma-start is a complete package to start working, this includes the whole js, sass, CSS folders and scripts to start working. So bulma-start should be considered as the parent folder of your project.

Removing Bower from Workflow and Migrating to npm

With npm becoming more and more popular by the day, I feel as though there is less of a need for me to continue using bower in my workflow.
I have read several articles on why the above is true, but have yet to find a guide detailing the steps one should take in order to smoothly and successfully migrate from bower to npm and then remove bower altogether.
I was hoping to find some more guidance here on how to do so. Anyone have any experience with this or tips?
Thanks
First of all I recommend to you to migrate to Yarn instead of npm. It does all the things done by npm with some more feature and also being more performing.
Their main differences are: Bower works with a bower.json file, Yarn and npm work with a package.json file but the content of these files are almost similar (package name, version, description, etc.); Bower saves by default its modules into the bower_components folder, the other two in the node_modules folder.
Assuming that you probably already have a bower.json file the steps are the following:
Init a new package inserting the asked informations:
$ yarn init # or 'npm init'
Then you could copy the dependencies and devDependencies from your bower.json file to the new package.json file OR I recommend to install them manually. Example:
$ yarn add jquery bootstrap # or 'npm install --save jquery bootstrap'
$ yarn add -D webpack babel # or 'npm install --save-dev webpack babel'
I hope it was helpful :)

How can I install npm packages without the source code

Is it possible to install an npm package without all the other artifacts. For instance install only the content of the dist folder for the jQuery npm package?
It remains to the module publisher to exclude such files as sources, docs, tests ... and only include build and binary files when they publish their npm package (via prepublish hooks, .npmignore files, etc ...).
Not all maintainers are aware / take that in account ... The only thing you can do, as a module consumer (when you npm install) is to use the --production flag, not to install devDependencies (but that's not what you're looking for)

How to shrinkwrap npm modules without local dependencies

I tried to maintain package.json with the list of node modules dependencies. when I call npm install it installs the node modules.and generates a folder for it in my app. I call the npm shrinkwrap. But this generates the dependency on the local node module
"dependencies": {
"async": {
"version": "0.2.5",
"from": "async#0.2.5",
"resolved": "https://registry.npmjs.org/async/-/async-0.2.5.tgz"
},
when I upload the app to the appfog server it can install from the npm-shrinkwrap.json. So Ideally I want to remove the node modules folder and just pass the shrinkwrap.json file. But it has this "from". I had in the past generated the shrinkwrap & it didn't have the "from" field in there.
How to generate without "from"/ can I just get a shrinkwrap file from package.json. so my app will be leaner. I can maintain all the node module globally.
Thanks
I'm a bit confused by your question.
Shrinkwrap does not install, package, upload or do anything to your dependencies.
All it does is scan your installed node_modules and record the versions (recursively) into a file. Invoking npm install after that file is defined becomes repeatable, which is a principle of software engineering.
"from" was introduced a few months back. The npm shrinkwrap command seems to set it to the URL from which a module was installed. This is probably for portability. npm install takes a module name, consults a registry (whose URL is configurable as an npm config setting) and installs it. I could take the same package.json and npm-shrinkwrap.json, put them on another machine and theoretically get a different result if that machine's npm config settings point it to a different registry. Therefore, embedding the resolved URL in the shrinkwrap file adds an additional level of repeatability to npm install
See the npm config man page for details of setting the registry parameters.
According to npm issue 3145 on github, the "from" setting is known to cause backwards-compatibility issues with pre-1.2.x npm systems. Upgrading is the only resolution.
https://github.com/isaacs/npm/issues/3145
I think that you are looking for shrinkpack: https://www.npmjs.com/package/shrinkpack
from the doc:
Shrinkpack complements the npm shrinkwrap command by maintaining a node_shrinkwrap directory in your project, containing the exact same tarballs that npm install downloads from https://registry.npmjs.org.
The rest of the npm install process is exactly the same. The only difference is that no network activity is necessary when installing and building your project. The node_shrinkwrap directory can be ignored in your editor (much like is done with the node_modules directory) but is instead checked into source control.