Gulp tasks are already set up for you. They are stored inside
Finder/gulpfile.js. But in order to have access to them via you Command Line tool you will need to install gulp-cli node package. Gulp CLI stands for Gulp Command Line Interface.
To do that type following line in your terminal:
Gulp CLI commands
- gulp clean - as the name implies it cleans dist folder from generated (compiled assests like css, js, vendor libs, etc.)
- gulp vendor - moves vendor libraries from
distfolder. Please check this article explaining how to add new vendor plugin to your project - Installing Vendor plugins with Npm and Gulp
- gulp js:expandedandgulp js:minified - compiles ES6 modules from
src/jsfolder, applies polyfill using Babel and then minifies and uglifies main
theme.jsfile and creates 2 files in
- gulp pug - compiles
src/templatesfolder into HTML in
- gulp sass:expanded - compiles
.scssfiles into non-minified CSS (css/theme.css). From
- gulp sass:minified - compiles
.scssfiles into minified CSS (css/theme.min.css). From
- gulp watch - launches
watchtask. It will watch changes of your
.pugfiles and automatically compile them into
Now you when you are equiped with all necessary tools and dev invironment is all set you are ready to dive into Finder customization.
Take some time to familiarize yourself with Project structure.