Build tools
Learn how to use Melvin’s included npm scripts to build our theme, compile source code.
Tooling setup
Melvin uses NPM scripts for its build system. Our package.json
includes convenient methods for working with the framework, including compiling code.
To use our build system and run our documentation locally, you’ll need a copy of Melvin’s source files and Node. Follow these steps and you should be ready to rock:
- Download and install Node.js, which we use to manage our dependencies.
- Navigate to the root
/GULP VERSION
directory and runnpm install
to install our local dependencies listed in package.json. When completed, you’ll be able to run the various commands provided from the command line. - Modify
gulp.config.js
to your suitable needs (distribtion directory, site name, site url for meta, …). - Run
gulp bundle
to compile all html files and copy assets in directory. - Run
gulp browser-sync
to watch your files for modifications and see the result on browser.
Using GULP scripts
Our [gulp.js] includes the following commands and tasks:
Task | Description |
---|---|
gulp show--help |
Show help |
gulp asset |
Copy all asset files to destination directory |
gulp html |
Create all html files with gulp-handlebars-file-include plugins |
gulp css |
Create minified version of application css file |
gulp js |
Create minified version of application js file |
gulp img |
Copy optimize version of your images to destination directory |
gulp bundle |
Copy and create all files to destination directory |
gulp watch |
Watch modification from development directories |
gulp browser-sync |
Watch modification from development directories |
Run gulp show--help
to see all the gulp tasks.
Online documentation
Learn more about using Melvin by reading its documentation.
Troubleshooting
Should you encounter problems with installing dependencies, uninstall all previous dependency versions (global and local). Then, rerun npm install
and gulp bundle
.