Local Development

Bootstrap project

With command

pnpm i

the project will install all dependencies.

Website preview

With command

pnpm docs:dev

the project will launch website for you to preview all existing component.

Local development

See Local development guide

1. With command

pnpm dev

will start the local development environment.

2. Add your component into play/src/App.vue

<template>
  <ComponentYouAreDeveloping />
</template>

<script setup lang="ts">
// make sure this component is registered in @element-plus/components
</script>

Modify App.vue file per your needs to get things work.

The following commands are also useful during development

Generate component template

With command

pnpm gen <component-name>
# eg.
pnpm gen awesome
pnpm gen awesome-button

will generate a component template in packages/components/awesome and packages/components/awesome-button directory.

Sync locale files

With command

pnpm locale:sync

will sync the new fields from the en.ts locale file to other locale files and add the comment // to be translated.