What is the best way to use Node dependencies?

Question

What is the best way to use Node dependencies?

Asked 8 years, 2 months ago

Viewed 400 times

2

Introducing:
Let’s go to a practical example, so that it is simple to understand...
I want to use the framework Bulma in my project, so I run the following command:

 $ npm install --save-dev bulma

Tchanram! Now I can find both the file Bulma.css complete in node_modules\bulma\css\bulma.css as it is also possible to find the scss files in node_modules\bulma\sass\*, hence the following question

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

Theoretically it makes sense, after all whoever cloned the project would have to run the $npm install, and then I would have the dependency exactly in this way, but what if I want to build this project? I would have to necessarily use a task Runner (Gulp) to move a copy of that file into my project?

Finally, the most correct way of making use of these dependencies left me a little confused, taking into account these needs, which is the best practice to adopt?

P.S.: I already make use of Gulp in the project

1 answer

Browser other questions tagged node.js npm

You are not signed in. Login or sign up in order to post.

by Sergio • **133,294** points · Answer 1 · 2016-10-23T05:41:32+00:00

You have 3 alternatives:

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

The first option is an alternative to the other two. The second and third, together with the second, are viable.

The reason why you should avoid using files inside node_modules is because if someone upgrades this dependency the old files (that worked) are changed and there is no way to see the changes. We typically delete the entire board on Github and changes are not recorded.

Having a copy only a purposeful human action can make the file change, and this is safer and gives less 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 in the code:

const biblioteca = require('minhaBiblioteca');

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