# CQuery

**Repository Path**: lesan2d/cquery

## Basic Information

- **Project Name**: CQuery
- **Description**: 无任何依赖的轻组件库，助你快速开发前端UI
- **Primary Language**: CSS
- **License**: MIT
- **Default Branch**: master
- **Homepage**: https://lesan2d.gitee.io/cquery/
- **GVP Project**: No

## Statistics

- **Stars**: 23
- **Forks**: 0
- **Created**: 2020-10-09
- **Last Updated**: 2024-06-18

## Categories & Tags

**Categories**: javascript-toolkits

**Tags**: 组件库, JavaScript, CSS

## README

## 简介

CQuery 是一个组件资源库，名字参考于 jQuery，你可以叫他 CSS Query 也可以叫他 Components Query，我希望它能够成为一部 **组件字典**，
让开发者在工作时能够便捷地引入一些组件，同时在没有设计灵感时也能通过翻看库中的资源来获得灵感。

CQuery 正在不断更新！如果你是一个经常需要编写界面的前端开发者，我相信它一定能为你提供一些帮助，喜欢的话麻烦点个Satr吧！

## 使用
### Script标签引入
暂未提供CDN，请自行下载引入

[cquery.js](https://gitee.com/antree/cquery/blob/master/dist/src/cquery.js)
[cquery.css](https://gitee.com/antree/cquery/blob/master/dist/src/cquery.css)

```html
<script src="./cquery.js"></script>
<link rel="stylesheet" href="./cquery.css">
<link rel="stylesheet" href="./layout.css">
```

```js
const initCQuery = function () {
	const { Accordion, Button, Setting, Tabs } = window.cquery;
	Accordion.setupDefault();
	Button.setupDefault();
	Setting.setupDefault();
	Tabs.setupDefault();
};

window.addEventListener('load', function () {
  initCQuery();
});
```

### ES Module
注意，NPM安装不支持 IE11兼容模式

```shell
yarn add @antree/cquery
```

```js
import CQuery from '@antree/cquery';

const initCQuery = () => {
	const { Accordion, Button, Setting, Tabs } = CQuery;
	Accordion.setupDefault();
	Button.setupDefault();
	Setting.setupDefault();
	Tabs.setupDefault();
};

initCQuery();
```

## License

[MIT](https://gitee.com/antree/cquery/blob/master/LICENSE)
Copyright (c) 2021-present, antree