assemble-pattern-lab

An easier-to-use and more extensible build system for pattern-lab.

This project uses Assemble to build projects with pattern lab conventions.

Note that this isn't 100% feature complete, and the focus was mostly on implementing the patterns - not the actual demo site, but this project does implement the actual patterns, e.g. the important parts, and you can easily add (or request) any functionality you require.

Also, there are a few differences in how this project handles templates. Instead of having to namespace partials, like {{> organisms-latest-posts }}, and then using a complex regex system for dynamically renaming these partials according to how they are organized in folders, here you can simply use {{organism "latest-posts"}}.

This has several advantages:

• Store your patterns wherever you want them, just tell Assemble where they are.
• We're adhering to mustache/handlebars conventions instead of working around them.
• We can easily extend and add new patterns, or allow metadata to be passed as context to templates and so on.

Getting Started

Download

First things first:

• Either download the project) from GitHub, or
• Use git to clone the project: git clone https://github.com/assemble/assemble-pattern-lab.git

Install dependencies

Next install the necessary dependencies to build the project, including Assemble and Grunt:

npm i

Build

With everything downloaded and installed, you should now be able to build the project by running:

grunt

Usage

The following patterns have been implements:

• atoms: used in templates with {{atoms "foo"}}
• molecules: used in templates with {{molecules "foo"}}
• organisms: used in templates with {{organisms "foo"}}
• templates: used in templates with {{templates "foo"}}
• pages: Pages are specified using src property or files object/arrays in the Gruntfile config (see below)

For any templates to actually be found during the build, you'll have to first tell Assemble where to find them in Gruntfile, like so:

assemble: {
  options: {
    // Pattern Lab templates
    patterns: {
      atoms: ['src/atoms/**/*.hbs'],
      molecules: ['src/molecules/**/*.hbs'],
      organisms: ['src/organisms/**/*.hbs'],
      templates: ['src/templates/**/*.hbs'],
    }
  },
  site: {

    // `pages` are defined here (you can use any of the Grunt files
    // patterns, e.g. src-dest, files object, files array, etc)
    files: {
      '_gh_pages/': ['src/pages/*.hbs']
    }
  }
}

Contributing

All contributions are welcome! The simplest way to show your support for this project is to "star" it.

Authors

Jon Schlinkert

• github/jonschlinkert
• twitter/jonschlinkert

License

Copyright (c) 2014 Jon Schlinkert, contributors. Released under the MIT, Creative Commons Attribution 3.0 Unported License licenses

This file was generated by verb-cli on March 15, 2014.