The Uniform Scaffold Package is a CLI tool designed to generate React components based on Canvas data. This package simplifies the process of creating and registering components in a Uniform project.
- Component Generation: Generates Canvas React components based on Canvas data with all the necessary imports, types and properties.
- Component Registration: Automatically registers components in the Custom Canvas resolver.
- Custom Folder Support: Optionally specify a custom folder path for your components.
Install the package using your preferred package manager:
npm install @uniformdev/scaffold
To use the package, you can run the following command:
Run the generate command to create a React component:
npx npx scaffold add
You can add a custom script to your package.json for easier usage:
"scripts": {
"scaffold:add": "scaffold add"
}
Run the command with:
npm run scaffold:add
Before running the command, you can configure the following environment variables:
- UNIFORM_API_KEY: Your Uniform API key.
- UNIFORM_PROJECT_ID: The ID of your Uniform project.
These can be set in a .env file or provided directly during the CLI process.
If you want to use a custom folder for your components, set the CUSTOM_CANVAS_FOLDER_PATH environment variable:
CUSTOM_CANVAS_FOLDER_PATH=src/components/custom-canvas
The package generates a React component and integrates it into the Canvas resolver by updating the component mappings.
- Set Environment Variables: Ensure the required variables (UNIFORM_API_KEY and UNIFORM_PROJECT_ID) are set.
- Run the Command: Use npx scaffold add or your custom npm script (npm run scaffold:add).