# plain-ui

**Repository Path**: plain-pot/plain-ui

## Basic Information

- **Project Name**: plain-ui
- **Description**: 基于plain-ui-composition的Vue3组件库
- **Primary Language**: JavaScript
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 69
- **Forks**: 0
- **Created**: 2019-06-25
- **Last Updated**: 2025-06-13

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# Plain Ui

## 一、主题相关开发规范

### 1. 组件全局注册前缀

- 在安装PlainUI的时候，调用以下代码：

```js
setComponentPrefix("pl")
```

### 2. css变量名前缀

- css变量名前缀是基于scss变量控制的，需要配置全局引入scss变量；
- $prefix 就是所需要的变量前缀字符串, 这个前缀得于组件注册前缀一致；

```js
export default {
  css: {
    sourceMap: false,
      loaderOptions:
    {
      sass: {
        prependData: `$prefix:'${globalComponentPrefix}'; @import "src/packages/styles/global.import.scss";`
      }
    },
  },
}
```

### 3. 在scss代码中，获取变量：

```scss
plv
(
plain-1

)
```

### 4. 组件样式前缀

- 组件的根节点，得加上具体的class，比如scroll组件得加上这个class

```js
getComponentCls('scroll')
```

- 组件的样式，得通过这个特定的class选择器来控制内部节点的样式

比如对grid-row组件的样式

```scss
@include prefix(grid-row) {

}
```

## 二、组件服务

- 论Service实例与Application实例的关系；



# Log

- 迁移完毕 plain design 组件

# Other

- 中文正则：[\u4e00-\u9fa5]+