Importing Starterkits

Starterkits are a potent way to spin up a Pattern Lab instance from a baseline set of patterns and assets. An agency could use it for each new client.

Referencing, immutable starterkits that serve as a baseline for many products are on the roadmap, but are not supported at this time.

If you are using Pattern Lab Node 2.X.X, you may use npm to import any starterkit that meets the right criteria.

• The starterkit must have a package.json file so npm can install it
• The starterkit must map its directories with the source: {...} paths defined in patternlab-config.json
  • Usually this is:
    • _annotations/
    • _data/
    • _meta/
    • _patterns/
    • css/
    • fonts/
    • images/
    • js/
    • favicon.ico

An example of a starterkit that meets these specs is starterkit-mustache-demo.

To import the starterkit, execute the following commands from a prompt:

npm install [starterkit-name]
gulp patternlab:starterkit-load --kit=[starterkit-name]

where [starterkit-name] is the name of the starterkit.

AT THE TIME OF THIS WRITING, LOADING A STARTERKIT WILL OVERWRITE ANY MATCHES INSIDE ./source A future improvement will be referencing starterkits, or at least a warning about existing content.

patternlab-config.json also defines a starterkitSubDir key which can be used to target a directory inside the starterkit module if need be.