Getting Started with Design System Publisher
Before using the Design System Publisher tool, you’ll need to set up your environment. You’ll need to have the following tools:
The documentation contains a Vaadin project for rendering UI examples, and you need to have the same development tools installed when doing Vaadin application development.
The CLI tool uses Git to clone an initial copy of the documentation project, so make sure to have Git installed.
Design System Publisher uses Node.js. Make sure it’s installed. Version 16 is recommended.
Create a New Project
Run the following command to create a new design system website project:
npx @vaadin/cli@2.7.0 dsp-init|
Tip
|
New to Terminal?
The terminal — also referred to as the command line or shell — is a text-based interface used to run commands on your computer. If you’re new to the terminal, see instructions for Windows, macOS, and Linux.
|
The tool asks for the name of your design system, which is used for things like the visible page title, and a folder name for the website project.
The initialization script should take about a minute to finish. Once done, you should have the website project in your current working directory. The project uses Git for version control.
Next Steps
See Development Server to learn how to run Design System Publisher locally.
See Production Setup to learn how to run prepare the documentation website for production deployment/hosting.
See the other articles to learn how to customize the content and the styles of your documentation website.
A77F9CDF-C06C-4498-8E57-A3C80F9554FD