Create a WordPress child theme for Scratch with grunt-init.
If you haven't already done so, install grunt-init.
Once grunt-init is installed, place this template in your ~/.grunt-init/
directory. It's recommended that you use git to clone this template into that directory, as follows:
git clone git@github.com:mrdink/grunt-wp-scratch.git ~/.grunt-init/wp-scratch-child
git clone git@github.com:mrdink/grunt-wp-scratch.git %USERPROFILE%/.grunt-init/wp-scratch-child
At the command-line, cd into an empty directory, run this command and follow the prompts.
grunt-init wp-scratch-child
Note that this template will generate files in the current directory, so be sure to change to a new directory first if you don't want to overwrite existing files.
Enable "Live Reload" under Advanced in the theme customizer to turn on livereload.js for development with grunt.
After running grunt prod
enable "Use minified assets" to use production files.
Unfamiliar with npm? Don't have node installed? Download and install node.js before proceeding.
From the command line:
- Install
grunt-cli
andbower
globally withnpm install -g grunt-cli bower
. - Navigate to the theme directory, then run
npm install
. npm will look atpackage.json
and automatically install the necessary dependencies. Also runbower install
, which installs front-end packages defined inbower.json
.
When completed, you'll be able to run the various Grunt commands provided from the command line.
grunt dev
— Compile Sass to CSS, concatenate and validate JSgrunt watch
— Compile assets when file changes are madegrunt prod
— Create minified assets that are used on non-development environmentsgrunt package
— Runs all tasks, copies all files excluding dev files, and compresses into a zip file
Forked from grunt-wp-theme by 10up.
Icon created by iconsmind.com from the Noun Project