created:7/29/2020
,updated:2/21/2021
Below, we go over how to add a component-controls
documentation site to new Gatsby projects, existing React projects, and existing Gatsby projects.
You can find a git repo and a live site.
Create a new folder:
mkdir my-gatsby-project && cd my-gatsby-project
Initialize the project:
yarn init
Add Gatsby and its dependencies:
yarn add gatsby react react-dom
package.json
"scripts": {"build": "gatsby build","start": "gatsby develop"},
The remaining steps are the same as for existing Gatsby projects.
All you have to do is add Gatsby as a dependency:
yarn add gatsby
Then follow the steps for existing Gatsby projects.
yarn add @component-controls/gatsby-theme-stories
Create a gatsby-config.js
file in your project's home directory:
gatsby-config.js
module.exports = {plugins: [{resolve: '@component-controls/gatsby-theme-stories',options: {configPath: '.config',},},],};
Check our create a documentation site tutorial