0.6.0 • Public • Published


A Yeoman generator for Clay

Circle CI

Clay Instance Generator

You can use the main generator to generate an new clay instance.

yo clay

This will add the following files:

Main Files

  • app.js
  • package.json

Main Folders

  • sites
  • components
  • behaviors
  • validators

Supplemental Files

  • .gitignore
  • .csscomb.json
  • .eslintrc

Gulp Files & Folders

  • gulp/tasks
  • gulp/utils
  • gulpfile.js

At the end, the generator will run npm install & will append the specified gulp dependencies into your package.json file.

Component Generator

You can use the component generator to generate new components in your clay repo.

yo clay:component <name>

This will create a folder in components/ with the name of your component, and will also add some files:

  • all.css
  • print.css (with display: none by default)
  • template.<lang> where <lang> is the language of your choice
  • bootstrap.yml
  • schema.yml

If you select nunjucks or jade, the template will have a tag (if specified), a class with your component's name, and the data-uri attribute used by kiln.

The bootstrap and schema will have fields (text by default) that you've specified.

Note: Your template language choice will be stored as the default the next time you run this generator, saving you time when creating multiple components.


You can pass a --tag argument with the name of the tag/element you want to use, rather than using the default of section. The acceptable tags are defined in the tags json.

yo clay:component <name> --tag <tag>


In addition to the default all.css and print.css, you can specify viewports to be created.

yo clay:component <name> --viewports <m or mobile>

# would create 0-600.css

yo clay:component <name> --viewports <t or tablet>

# would create 600-1024.css

yo clay:component <name> --viewports <d or desktop>

# would create 1024+.css

You can also specify arbitrary viewports by passing in a comma-separated string. For more details on the syntax, see responsive-filenames.

yo clay:component <name> --viewports 0-300,300-600,600+,1200+

# would create:



This is useful if you want to quickly scaffold components for release on npm. Their name gets prepended with clay-, and they additionally get a package.json,, and .eslintrc. All options and prompts for internal components are available for npm components.

yo clay:component <name> --npm

Note: It will create all files in the current directory, rather than in a components/<name> folder.

Site Generator

You can use the site generator to generate new sites in your clay repo.

yo clay:site <name>

It will prompt you for the human-readable name, domain, and path. It'll add these files:

  • index.js with a default route
  • config.yml with your site config
  • local.yml pointing to localhost. This allows you to develop quickly and easily



Package Sidebar


npm i generator-clay

Weekly Downloads






Last publish


  • dontae-vox-media
  • shilpa.shetty
  • tara.siegel
  • alex-vox-media
  • wramirez92
  • nymdev
  • nymdocker
  • reubenson
  • kerenlerner
  • nymedia
  • nymagwebops
  • phyllisstein
  • jordanp9312
  • ealcantara22
  • san_amiro
  • yoshokatana
  • techmsi