Docs
Angular
Angular
Install and configure Angular.
Create project
Run the init
command to create a new Angular project or to setup an existing one:
npx shadcn-ng@latest init
npm
yarn
pnpm
bun
You can use the -d
flag for defaults i.e new-york
, zinc
and yes
for the css variables.
npx shadcn-ng@latest init -d
npm
yarn
pnpm
bun
Configure components.json
You will be asked a few questions to configure components.json
:
Which style would you like to use? › New York
Which color would you like to use as base color? › Zinc
Do you want to use CSS variables for colors? › no / yes
That’s it
You can now start adding components to your project.
npx shadcn-ng@latest add button
npm
yarn
pnpm
bun
The command above will add the Button
component to your project. You can then import it like this:
import { Component } from "@angular/core";
import { UbButtonDirective } from "@/components/ui/button";
@Component({
standalone: true,
imports: [UbButtonDirective],
template: `<button ubButton>Button</button>`,
})
export class ButtonDemoComponent {}