I recently discovered that I can use npm as a task runner instead of gulp or grunt, everything is fantastic so far (lint, stylus, jade, uglify, watch .. etc) but the concatenation part, I cannot seem to achieve that. With gulp it was something like:
gulp.task('scripts', function() {
return gulp.src('www/js/**/*.js')
.pipe(concat('all.js'))
.pipe(gulp.dest('www/dist'))
.pipe(rename('all.min.js'))
.pipe(uglify())
.pipe(gulp.dest('www/dist'));
});
Is there a way I can do that with npm?
To be more clear, my goal is to do something like this:
// package.json
{
"name": "f_todo",
"version": "1.0.0",
"description": "",
"main": "index.js",
"author": "",
"license": "MIT",
"devDependencies": {
"concat": "^1.0.0",
"rerun-script": "^0.6.0",
"stylus": "^0.53.0"
},
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"stylus": "stylus ss --compress --out lib/stylesheets",
"concat": "concat dependency code would be here",
"dev": "rerun-script"
},
"watches": {
"stylus": "ss/**"
}
}
Using npm as a build tool is all about working in the package. json file and creating custom scripts in the scripts object of file, so that is where we will spend most of our time.
The npm build is used to build a package, the synopsis is given in the next section. where <package-folder> is a folder that contains a package. json in its root. This is the plumbing command that is called by npm link and npm install.
npm run build creates a build directory with a production build of your app. Set up your favorite HTTP server so that a visitor to your site is served index. html , and requests to static paths like /static/js/main.
npm build is an internal command and is called by link and install commands, according to the documentation for build: This is the plumbing command called by npm link and npm install. You will not be calling npm build normally as it is used internally to build native C/C++ Node addons using node-gyp.
try this
var concat = require('concat')
concat(['a.css', 'b.css', 'c.css'], 'all.css')
https://www.npmjs.com/package/concat
and don't forget about npm install concat
By command
use concat-glob-cli
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"concat": "concat-glob-cli -f path/to/**/*.js -o bundle.js",
...
},
https://www.npmjs.com/package/concat-glob-cli
You can also use the power of the shell to do what you want:
"scripts": {
"concat": "cat www/js/**/*.js > all.js"},
Yep, concat is gone. I was looking at this as well while moving away from gulp to pure node and found the package to be missing.
As an alternative I am now using buildify. Might be a slight overkill, but it works.
var buildify = require('buildify');
var files = [
"./node_modules/moduleA/file1.js",
"./node_modules/moduleB/file2.js",
];
buildify()
.concat(files)
.save("./dist/www/scripts/init.min.js");
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With