https://github.com/mrpluto0/createui

A colorful vue2 component lib
https://github.com/mrpluto0/createui

component vue2

Last synced: 3 days ago
JSON representation

A colorful vue2 component lib

• Host: GitHub
• URL: https://github.com/mrpluto0/createui
• Owner: MrPluto0
• Created: 2022-03-15T13:26:02.000Z (over 2 years ago)
• Default Branch: master
• Last Pushed: 2022-06-03T08:54:38.000Z (over 2 years ago)
• Last Synced: 2024-09-30T17:08:37.268Z (3 days ago)
• Topics: component, vue2
• Language: JavaScript
• Homepage:
• Size: 10.7 MB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# CreateUI 组件库

## 功能

- [x] 全局加载

- [x] 按需加载

- [x] [介绍网站](https://mrpluto0.github.io/CreateUI/)

- [ ] 国际化配置

## 组件

- [x] Chatbox 畅聊气泡

- [x] Loading 加载动画

- [x] Toast 消息提示框

- [x] Modal 模态对话框

- [x] Musicbox 八音盒

## 安装

```

npm install @gypsophlia/create-ui -S

```

## 用法

### 全局引入

```js

import CreateUI from "@gypsophlia/create-ui";

import "@gypsophlia/create-ui/lib/theme/index.css";

Vue.use(CreateUI);

```

### 按需引入

```js

import { Chatbox } from "@gypsophlia/create-ui";

Vue.use(Chatbox);

```

## 按需引入配置

### `babel-plugin-component`

安装插件

```

npm install babel-plugin-component -D

```

Babel 配置

```js

plugins: [

  [

    "component",

    {

      libraryName: "@gypsophlia/create-ui",

      styleLibrary: {

        name: "theme",

        base: false,

      },

    },

  ],

];

```

### `babel-plugin-import`

安装插件

```

npm install babel-plugin-import -D

```

Babel 配置

```js

plugins: [

  [

    "import",

    {

      libraryName: "@gypsophlia/create-ui",

      styleLibraryDirectory: "lib/theme",

    },

  ],

];

```

> 或将以下配置写入`vue.config.js`中的 `configureWebpack`中

Webpack 配置

```js

// webpack.config.js

resolve: {

  extensions: [".css"];

}

```