https://github.com/joyceql/tracer-ui
一个vue3的pc端组件库，支持按需加载。
https://github.com/joyceql/tracer-ui
gulp pnpm rollup vite2 vue3-composition-api
Last synced: 11 months ago
JSON representation
一个vue3的pc端组件库，支持按需加载。
- Host: GitHub
- URL: https://github.com/joyceql/tracer-ui
- Owner: JOYCEQL
- Created: 2022-01-27T02:10:58.000Z (over 4 years ago)
- Default Branch: master
- Last Pushed: 2022-02-14T14:48:08.000Z (over 4 years ago)
- Last Synced: 2025-03-14T20:44:00.015Z (about 1 year ago)
- Topics: gulp, pnpm, rollup, vite2, vue3-composition-api
- Language: Vue
- Homepage: https://joyceql.github.io/web-doc
- Size: 165 KB
- Stars: 2
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Tracer-UI
一个使用vite2构建的支持vue3的PC端组件库
## 安装
```shell
//npm
npm install tracer-ui
//yarn
yarn add tracer-ui
//pnpm
pnpm install tracer-ui
```
## 全量引入
```js
//main.js
import { createApp } from 'vue'
import App from './App.vue'
import tracer from 'tracer-ui'
import 'tracer-ui/lib/style.css'
createApp(App).use(tracer).mount('#app')
```
## 按需引入
安装babel-plugin-tracer
```js
yarn add babel-plugin-tracer -D
```
在 **babel.config.js** 中添加配置
```js
module.exports = {
plugins: [
["babel-plugin-tracer", {
"cssPath": "tracer-ui/lib/style/{key}.css",
"jsPath": "tracer-ui/lib/Tracer.es.js",
"lib": "tracer-ui"
}]
]
}
```
然后在main.js中引入
```js
//main.js
import { createApp } from 'vue'
import App from './App.vue'
import {Button} from 'tracer-ui'
createApp(App).use(Button).mount('#app')
```
## 单文件组件中直接使用
```vue
tracer-ui
```