What is the best way to use Node dependencies?

Question

What is the best way to use Node dependencies?

Navigation

#1 by (2 votes)

2

Introduction:
Let's take a practical example so that it's simple to understand ...
I want to use the Bulma framework in my project, so run the following command:

 $ npm install --save-dev bulma

Tchanram! Now I can find both the bulma.css complete file in node_modules\bulma\css\bulma.css and you can also find the scss files in node_modules\bulma\sass\* , hence the following questioning

Problem:
If I want to use the complete bulma.css file, should I reference in my html the path to this file there in the node_modules directory? That is, insert in my <head> the line: <link rel="stylesheet" href="node_modules\bulma\css\bulma.css"> ?

Theoretically it makes sense, after all who clone the project would have to run $npm install , and then there would be dependence exactly on that path, but what if I want to build this project? Would I have to use a task runner (gulp) to move a copy of this file into my project?

Finally, the most correct way to make use of these dependencies made me a bit confused, considering these needs, what is the best practice to adopt?

P.S.: I already use gulp in the project

node.js npm

asked by anonymous 23.10.2016 / 07:21

1 answer

Button to quit app What is 'binding time' in the development context?

score 2 · Accepted Answer

You have 3 alternatives:

use CDN, for example https://cdnjs.cloudflare.com/ajax/libs/bulma/0.2.3/css/bulma.css
use the file within node_modules
copy to your project

The first option is an alternative to the other two. The second disclaimer and the third, along with the second, is feasible.

The reason you should avoid using files within node_modules is because if someone upgrades this dependency the old files (which worked) are changed and there is no way to see the changes. Typically we exclude the entire board in Github and the changes are not recorded.

Having a copy only a purposeful human action can make the file change, and this is safer and gives fewer bugs.

To copy you have several alternatives. Or copies by hand, for example with a script like this:

var async = require('async');
var exec = require('child_process').exec;
// funcão para copiar
function copy(from, to, cb){
    var cmd = ['cp', from, to].join(' ');
    exec(cmd, {
        cwd: __dirname + '/../'
    }, function(err){
        if (err) console.log('Copy failed.', err);
        else cb(err);
    });
}
// módulos que precisam ser copiados
function copyDatePicker(cb){
    async.series([
        function(next){
            copy(
                'node_modules/component-picker/lib/ComponentPicker.js',
                'public/javascript/ComponentPicker.js',
                next
            );
        }, function(next){
            copy(
                'node_modules/component-picker/lib/ComponentPicker.css',
                'public/css/ComponentPicker.css',
                next
            );
        }
    ], cb);
}

or you can use it in the code:

const biblioteca = require('minhaBiblioteca');

and then compile with webpack or browserify and so they import the required code into a new file .js created with the whole code.