Once you’ve got Gulp WP Toolkit set up within your WordPress theme you can run any of the available Gulp tasks from the command line. Most of the hard work is carried out by the range of build tasks, including:
gulp build
gulp build runs all of the following tasks, in parallel, in one operation. You might use this if you’ve just cloned a fresh copy of your theme, and want to build all of the theme assets.
gulp build:css
You can run gulp build:css independently to quickly compile new CSS files from your SCSS. By default, this task will compile /develop/scss/style.scss to /style.css. Further configuration should be added to your Gulpfile.js if you’d like to include additional SCSS/CSS files. See documentation.
gulp build:js
The gulp build:js task can also be run independently to compile new JS files from your configured sources. See documentation.
gulp build:images
The image optimisation task gulp build:images will automatically process image files inside /develop/images and output them in /images. Only images which have been changed since the task last ran will be processed.
gulp build:i18n
The internationalizion task gulp build:i18n runs two further tasks in the background.
It uses gulp build:i18npotgen to create (or update) a theme translation template file (.pot) inside develop/languages. The file will be named according to your theme textdomain.
As well as .pot file generation, the internationalizion task runs gulp build:potomo so that any .po files within /develop/languages are automatically converted to .mo files and output in /languages.
Other Build Tasks
There are also a couple of experimental build tasks, gulp build:styleguide uses a tool called Hologram to create a living style guide for your WordPress theme. This is quite fiddly to set up, and will be covered in a later post.
The gulp build:rtl task is also available. It reads the theme style.css file and uses it as a basis to generate an RTL stylesheet at rtl.css. While this is functional, it needs some additional work to expand its coverage to other generated stylesheets.