jsxiaosi / xs-components-lib

๐ŸŽ‰๐ŸŽ‰๐ŸŽ‰A ready-to-use component library template allows rapid development of your component libraryใ€‚ไธ€ๆฌพๅผ€ๅฐๅณ็”จ็š„็ป„ไปถๅบ“ๆจก็‰ˆ๏ผŒ่ฎฉไฝ ๅฟซ้€Ÿๅผ€ๅ‘ๅฑžไบŽไฝ ็š„็ป„ไปถๅบ“

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Component library template

Component library template developed based on Vue3, VitePress, Rollup, Gulp and other mainstream technologies
Built-in packaging components, Hooks, Utils, which can be introduced on demand, support TypeScript, and enable all attention to focus on document writing and component development.
Built-in VitePress theme eliminates the trouble of writing style, with its own night mode, and can customize the theme.

English | ็ฎ€ไฝ“ไธญๆ–‡

Docs

https://xs-com-lib.netlify.app

Features

  • ๐Ÿš€ Latest technology stack
    It is developed using front-end cutting-edge technologies such as Vue3/Rollup/Gulp
  • ๐Ÿ“ฆ Out of the box
    Built-in packaging can be introduced on demand, and TypeScript is supported, so that all attention can be focused on document writing and component development.
  • ๐Ÿ”— Support CDN introduction
    Support the packaging and output of compact CDN modules, and simultaneously support UnPkg and JsDelivr CDN introduction methods.
  • โšก๏ธ VitePress
    Vue official document theme, free of the trouble of writing style, with its own night mode, customizable theme.
  • ๐Ÿ’ป One-click template generation command
    Say goodbye to the trouble of manually creating development templates by machine, and generate development templates quickly and easily with one command.
  • ๐Ÿšง Specification inspection
    Built-in Eslint, Prettier and CommitLint tools can better unify your code style and submit inspection specifications.

Prepare

  • Node and Git - project development environment
  • Vite - Familiar with Vite features
  • Vue3 - Familiar with Vue basic syntax
  • Es6+ - familiar with Es6 basic syntax
  • VitePress - familiar with the basic use of VitePress

Installation and use

  • Get project code (Https or SSH)
git clone https://github.com/jsxiaosi/xs-components-lib.git

git clone git@github.com:jsxiaosi/xs-components-lib.git

Alternatively, you can use the xs-clito quickly create one

npx @jsxiaosi/xs-cli create [project-name]
  • Installation Dependencies
pnpm install

Developer

  • Run built-in template debugging component
npm run dev
  • Run the VitePress document
npm run docs:dev
  • Create component template
npm run ct 'Component name'

Production

  • Package Component Library
npm run build
  • Packaging a VitePress document
npm run docs:build

Git Contribution submission specification

  • Refer to Vue specification

    • feat New Features
    • fix Repair defects
    • docs Document change
    • style Code format
    • refactor Code refactoring
    • perf Performance optimization
    • test Add neglected tests or changes to existing tests
    • build Build processes, external dependency changes (such as upgrading npm packages, modifying packaging configurations, etc.)
    • ci Modify CI configuration and scripts
    • revert Roll back the commit
    • chore Changes to the build process or tools and libraries (do not affect source files)
    • wip Under development
    • types Type definition file modification
  • Or submit with instructions

npm run cz

Specification related

Catalogue

.
โ”œโ”€โ”€ LICENSE
โ”œโ”€โ”€ README.md
โ”œโ”€โ”€ build
โ”œโ”€โ”€ commitlint.config.js
โ”œโ”€โ”€ docs                                # Vitepress document directory
โ”œโ”€โ”€ effect                              # Commissioning template
โ”œโ”€โ”€ lib
โ”œโ”€โ”€ node_modules
โ”œโ”€โ”€ package-lock.json
โ”œโ”€โ”€ package.json
โ”œโ”€โ”€ packages                            # Common component directory
โ”‚   โ”œโ”€โ”€ components                      # Component storage directory
โ”‚   โ”œโ”€โ”€ hooks                           # Hooks storage directory
โ”‚   โ”œโ”€โ”€ theme-default                   # Component style storage directory
โ”‚   โ”œโ”€โ”€ utils                           # Public method storage directory
โ”œโ”€โ”€ postcss.config.js
โ”œโ”€โ”€ prettier.config.js
โ”œโ”€โ”€ script
โ”œโ”€โ”€ stylelint.config.js
โ”œโ”€โ”€ tsconfig.json
โ””โ”€โ”€ typings

Thanks for the help of the following excellent projects

maintainers

@jsxiaosi

License

MIT ยฉ 2022

About

๐ŸŽ‰๐ŸŽ‰๐ŸŽ‰A ready-to-use component library template allows rapid development of your component libraryใ€‚ไธ€ๆฌพๅผ€ๅฐๅณ็”จ็š„็ป„ไปถๅบ“ๆจก็‰ˆ๏ผŒ่ฎฉไฝ ๅฟซ้€Ÿๅผ€ๅ‘ๅฑžไบŽไฝ ็š„็ป„ไปถๅบ“

License:MIT License


Languages

Language:TypeScript 70.2%Language:Shell 11.0%Language:JavaScript 10.0%Language:HTML 4.0%Language:Vue 3.9%Language:SCSS 0.9%