Skip to content
A build system just using NPM. No Gulp or Grunt etc.
HTML JavaScript CSS
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Type Name Latest commit message Commit time
Failed to load latest commit information.

NPM Solo

A build system just using NPM. No Gulp or Grunt etc.

I'm not sure whether this is a ideal build config for larger projects. Maybe that's when Gulp is better

Things I want this build config to do

Some of these have been completed now as can be seen in the package.json file.

  1. Templating language into HTML - (Handlebars, Nunjucks, Liquid...?)
  2. SCSS compiling
  3. CSS pre- or postprocessor
  4. JavaScript Linting and Testing
  5. ES6 transpiler
  6. Dependency Management
  7. JS Uglification
  8. File watcher
  9. Image minification

Helpful NPM tips

Used these articles as a starter for ten:

Thanks to Bret Cameron for this article - 13 npm Tricks for Faster JavaScript Development. It's primary targeted at JS development but there are definitely some take-aways if JS isn't necessarily your focus.

Here are a few tips I've gleaned from his article that I found particularly helpful. For my needs anyhow:

  • npm install -g json - (Edit package.json from the Command Line)
    • Then you can use it for in-place editing with -I . For example, to add a new script “foo” with the value “bar”, type: json -I -f package.json -e '"bar"'
  • npm i -D cross-env - (Make Scripts Cross-Platform Compatible eg. for Windows users)
  • npm i -D npm-run-all - (Run Scripts in Parallel)
  • npm i -g ntl - (List and Select Available Scripts)
    • Then run the ntl command in the project folder. You’ll get a list of available scripts, with the option of selecting one of them to run.

Keeping NPM packages & dependencies up to date

  • If you use VS Code, install the Version Lens extension
  • Install the npm-check-updates CLI tool like this...
    • npm i -g npm-check-updates
    • To use / run it, ncu
    • To update all the packages, ncu -u
    • To update a specific package, ncu node-sass

Some interesting NPM packages

You can’t perform that action at this time.