.. | ||
app | ||
test | ||
package-lock.json | ||
package.json | ||
README.md |
Primer Module Generator
Primer is the CSS framework that powers GitHub's front-end design. This is a Yeoman generator that we use to scaffold new Primer modules.
Usage
In the Monorepo
-
cd
to the top level directory of theprimer
repository -
Run:
npm run new-module
You can also pass the module name as a positional argument like this:
npm run new-module -- primer-module-name
-
Answer the interactive prompts.
If you don't know some of the answers (aside from the module name, which is required), it's okay to press enter or return.
-
If all goes well, the new module will be bootstrapped and ready to use. You should see a directory with this structure:
modules/primer-module-name/ ├── LICENSE ├── README.md ├── index.scss ├── lib │ └── module-name.scss └── package.json
-
If you have any TODOs left from unanswered prompts, fill them out! You can list them again with:
ack TODO modules/primer-module-name
(Note: you can use
grep
if you don't haveack
installed.)
Standalone installation
This repository is distributed with npm. After installing
npm, you can install generator-primer-module
with this command.
npm install --save generator-primer-module
You'll also need to install the yo
CLI:
npm install -g yo
Standalone usage
It's possible to use this generator to create "standalone" Primer modules that live outside of the Primer monorepo, with the following caveats:
- When prompted to add the new module to existing meta-packages, you will need to un-select them all.
- You will also need to manually install all of the monorepo's top-level devDependencies to get tools like
primer-module-build
andava
. - The
npm test
command will not work, because it references a test spec in the monorepo.
To run the generator, just pass primer-module
to the yo
CLI:
yo primer-module
Then answer the interactiv prompts. Note that, unlike most other generators, this one creates a new directory with the provided module name in the current working directory.
You can also pass the module name as a positional argument, as in:
yo primer-module primer-foo-bar