I’ve been using Grunt for WordPress development for a while. It’s a great tool and help a lot in automation tasks like compiling LESS to CSS, minifying CSS/JS files, etc. But one problem I met when using Grunt is in every project I work on, there’s always a folder
node_modules taking a lot of disk space (around 100MB). Thing is most projects use the same packages, same tasks, just different configuration. So I think it should be a way to share these packages between projects. Symlink is the first idea, but it requires too much work. Until now…
The idea is similar to using Symlink, but easier with built-in features of NodeJS (npm). It has option to install packages globally and link them to current project. Let’s see how to do it:
First step: install all packages globally
Normally we install package locally (inside project) and save it as dev dependencies (
--save-dev). But now we want to share them between projects, so we install them globally, like this:
npm install -g grunt-contrib-less npm install -g grunt-contrib-uglify
(you can add more packages as you want)
Using these commands, we don’t need to worry where packages are stored (we have to if we use symlink).
Second step: link packages to current project
Now we need to create link to packages in project. Run these commands:
cd /path/to/project npm link grunt-contrib-less npm link grunt-contrib-uglify
After running these commands, you will see a
node_modules in your project with all above packages. Don’t worry, they’re just symlink! (like normal symlink, but created automatically by
Third step: require packages in
Now in your
Gruntfile.js, you should load packages like this:
And then you can add your Grunt configuration!
That’s all, now if you have 100 projects, all Grunt packages takes you only ~ 100 MB for all! Is that awesome?
Note that this technique can be applied to not only Grunt, but also Gulp and other
npm packages as well. Hope it’s useful for you.