Create Lit Component

A command-line tool to generate Lit web components with a standardized structure.

Usage

You can use this generator with npm's create command:

# Using npm
npm create lit-component my-awesome-component

# Using yarn
yarn create lit-component my-awesome-component

# Using pnpm
pnpm create lit-component my-awesome-component

Or you can install it globally and use it:

# Install globally
npm install -g create-lit-component

# Then use it
create-lit-component

Options

When using the CLI, you'll be prompted for information, or you can provide it via command-line options:

• --name: Name of the component
• --tags: Add tags to the component (comma separated)
• --directory: Specify a directory for the component (default: current directory)
• --description: Description of the component
• --yes: Skip all prompts and use default values

Example:

npm create lit-component -- --name my-counter --tags ui,counter --directory components

Note: When using npm create with arguments, you need to add -- before passing arguments.

Generated Component Structure

The generator will create a new Lit component with the following structure:

my-component/
├── README.md
├── package.json
├── tsconfig.json
├── src/
│   ├── index.ts
│   └── lib/
│       └── my-component.ts
└── test/
    └── my-component.test.ts

Development

Building the package

npm run build

Publishing to npm

npm publish

License

MIT