16337b25bb
- primer-alerts@1.5.11 - primer-avatars@1.5.8 - primer-base@1.9.0 - primer-blankslate@1.5.0 - primer-box@2.5.11 - primer-branch-name@1.0.9 - primer-breadcrumb@1.5.7 - primer-buttons@2.6.2 - primer-core@6.10.5 - primer-forms@2.1.6 - primer-labels@1.5.11 - primer-layout@1.6.0 - primer-markdown@3.7.11 - primer-marketing-buttons@1.0.11 - primer-marketing-support@1.5.4 - primer-marketing-type@1.4.11 - primer-marketing-utilities@1.7.1 - primer-marketing@6.3.1 - primer-navigation@1.5.9 - primer-page-headers@1.5.1 - primer-page-sections@1.5.1 - primer-pagination@1.0.5 - primer-popover@0.1.6 - primer-product@5.8.0 - primer-progress@0.1.0 - primer-subhead@1.0.9 - primer-support@4.7.0 - primer-table-object@1.4.11 - primer-tables@1.5.1 - primer-tooltips@1.5.9 - primer-truncate@1.4.11 - primer-utilities@4.14.0 - primer@10.10.0 - generator-primer-module@1.2.0 - primer-module-build@1.0.7 - stylelint-config-primer@3.0.0 - stylelint-selector-no-utility@2.0.0 |
||
---|---|---|
.. | ||
app | ||
test | ||
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