Updated NodeJS tools

Written: 3.10.2018 Updated: 10.6.2019

Today we have started to roll out NodeJS version 8, as well as new versions of related tools NPM, Yarn, Gulp, Grunt, Webpack, Browserify and Bower. We have provided NodeJS tools for our customers for years now, to help our customers have whatever development workflow they want, including the possibility to use NodeJS tools like Gulp to automatically compile assets for their website. In addition to the pre-installed tools also npm is available, so customers can also install more NodeJS packages if they want, including simply running npm install if their project has a package.json file. Some might nowadays also prefer to use Yarn instead. Updated versions of the forementioned will appear soon in both our development (Vagrant), testing and production environments.

NodeJS logo

The NodeJS version 8 is a Long Term Support (LTS) version, so we indend to stick to if for a longer time. The NodeJS ecosystems moves fast, and some tools that were hugely popular just two years ago might already be abandoned, like Bower for example. We still keep it included for backwards compatibility.

Note that currently all tools are designed for development use, not actually for serving your site. In the future we might also start offering our customers the possibility to run a NodeJS front on their site once the WordPress world becomes more standardized in how ReactJS based themes present themselves to the world. Please leave comments below if you have thoughts on this!

Take advantage of the best developer tools available for your WordPress site today with Seravo premium hosting and upkeep! 

Developer tip: automatically compile SASS on every git checkout

Did you know our environments come with a full-fledged git installation out-of-the-box for developers to enjoy? You can read all about our developers tools at seravo.com/docs.

One typical use case for git and NodeJS in concert is automatic compilation of SASS, the language for maintaining CSS. In git you can define all kinds of hooks that trigger automatically during specific git operations. Take a look at the .git/hooks/ directory and you will discover many sample files that you can modify to your needs and activate by stripping the .sample suffix.

/data/wordpress$ ls .git/hooks/*-*
.git/hooks/applypatch-msg.sample
.git/hooks/post-update.sample
.git/hooks/prepare-commit-msg.sample
.git/hooks/commit-msg.sample
.git/hooks/pre-applypatch.sample
.git/hooks/pre-push.sample
.git/hooks/post-merge.sample
.git/hooks/pre-commit.sample
.git/hooks/pre-rebase.sample

At Seravo.com we use SASS for our stylesheets, and we have the following post-merge hook:

#!/bin/bash
##
# A Git hook to compile Seravo theme Sass after git pull.
##

# Show errors
set -e;

# Source environment if doesn't exist yet
if [ -z $PS1 ]; then
  source /etc/container_environment.sh
fi

# This hook is only for non-development environments.
if [ $WP_ENV == 'production' ] || [ $WP_ENV == 'staging' ]
then
  echo "Githook: compiling Seravo theme Sass...";
  /usr/local/bin/sass --update --force /data/wordpress/htdocs/wp-content/themes/seravo/css/;
fi

When git pull is run on the server, it can look like this:

/data/wordpress$ git pull
Receiving objects: 100% (209/209), 368.85 KiB | 1.58 MiB/s, done.
objects.
From github.com:Seravo
   e3764cf..8c4f534  master               -> origin/master
 themes/seravo/css/_case.scss                     |    2 +-
 themes/seravo/css/_comments.scss                 |   30 +-
 themes/seravo/css/_footer.scss                   |    4 +-
 themes/seravo/css/_fp-blog-section.scss          |    2 +-
 themes/seravo/css/_fp-community-involvement.scss |   50 +
 themes/seravo/css/_fp-cta.scss                   |    6 +-
 themes/seravo/css/_fp-customers.scss             |    4 +-
Githook: compiling Seravo theme Sass...
      write /data/wordpress/htdocs/wp-content/themes/seravo/css/layout.css
      write /data/wordpress/htdocs/wp-content/themes/seravo/css/layout.css.map
/data/wordpress$

Feel free to use this tip and all of our other developer tools to make your work easier and more productive than ever before. Happy coding!

Leave a comment

Otto Kekäläinen

CEO

Search Seravo.com

Categories

More reading

PHP 7.4 released

3.12.2019

The PHP project announced the release of PHP 7.4 on November 28th, 2019. As usual, they have also published a […]

5+1 WordPress Tips for Bloggers

28.11.2019

Why should you start your blog on WordPress? Where do you begin when building the site? What do things like […]

World-Class Upkeep for a World-Class Event

21.11.2019

Besides Slush, Nordic Business Forum is one of the biggest success stories in the Finnish event scene. What started in […]