Pattern Lab Node - Grunt Edition
The Grunt wrapper around
Pattern Lab Node Core, providing tasks to interact with the core library and move supporting frontend assets.
Packaged Components
The Grunt Edition comes with the following components:
*
patternlab-node:
GitHub,
npm
*
patternengine-node-mustache:
GitHub,
npm
*
pattern-lab/styleguidekit-assets-default:
GitHub
*
pattern-lab/styleguidekit-mustache-default:
GitHub
Prerequisites
The Pattern Lab Node - Grunt Edition uses
Node for core processing,
npm to manage project dependencies, and
grunt.js to run tasks and interface with the core library. Node version 4 or higher suffices. You can follow the directions for
installing Node on the Node website if you haven't done so already. Installation of Node will include npm.
It's also highly recommended that you
install grunt globally.
Installing
There are two methods for downloading and installing the Grunt Edition:
*
Download a pre-built package
*
Use npm
$3
The fastest way to get started with the Grunt Edition is to
download the pre-built version from the
releases page. The pre-built project comes with the
Base Starterkit for Mustache installed by default.
Please note: Pattern Lab Node uses
npm to manage project dependencies. To upgrade the Grunt Edition or to install plug-ins you'll need to be familiar with npm.
$3
npm is a dependency management and package system which can pull in all of the Grunt Edition's dependencies for you. To accomplish this:
* download or
git clone this repository to an install location.
* run the following
``
cd install/location
npm install
`
Running npm install
from a directory containing a package.json
file will download all dependencies defined within.
#### Install the Grunt Edition of Pattern Lab Node as a Dependency
Most people want to run Pattern Lab Node standalone and not as a dependency. If you wish to install as a dependency you can do the following:
Use npm's install
command with an argument to install the Grunt Edition into a location of your choosing. In Terminal type:
cd install/location/
npm install edition-node-grunt
This will install the Grunt Edition into a directory called node_modules
in install/location/
.
Getting started
The Pattern Lab Node - Grunt Edition ships with a base experience which serves as clean place to start from scratch with Pattern Lab. But if you want to get rolling with a starterkit of your own, or use the demo starterkit like the one on demo.patternlab.io, you can do so automatically at time of npm install
by adding your starterkit to the package.json` file.
You can also
work with starterkits using the command line.
Updating Pattern Lab
To update Pattern Lab please refer to each component's GitHub repository, and the
master instructions for core. The components are listed at the top of the README.
Helpful Commands
These are some helpful commands you can use on the command line for working with Pattern Lab.
$3
To list all available commands type:
grunt patternlab:help
$3
To generate the front-end for Pattern Lab type:
grunt patternlab:build
$3
To watch for changes, re-generate the front-end, and server it via a BrowserSync server, type:
grunt patternlab:serve
BrowserSync should open
http://localhost:3000 in your browser.
$3
To install a specific StarterKit from GitHub type:
npm install [starterkit-vendor/starterkit-name]
grunt patternlab:loadstarterkit --kit=[starterkit-name]