安装 Installation

安装

通过 npm 安装

npm i element-ui -S
npm i @ctc-front/components-ui -S

下载本地包安装

如果无法访问 npm 仓库，可以下载本地包安装：

最新版本 (0.3.0)：ctc-front-components-ui-0.3.0.tgz

npm i ./ctc-front-components-ui-0.3.0.tgz

历史版本下载

版本	下载链接
0.3.0	ctc-front-components-ui-0.3.0.tgz
0.2.5	ctc-front-components-ui-0.2.5.tgz
0.2.4	ctc-front-components-ui-0.2.4.tgz
0.2.3	ctc-front-components-ui-0.2.3.tgz
0.2.2	ctc-front-components-ui-0.2.2.tgz
0.1.4	ctc-front-components-ui-0.1.4.tgz

快速上手 Quick Start

1. 完整引入 (Full Import)

推荐使用完整引入以获得完整的主题管理能力和最便捷的开发体验。

/* main.js */
import Vue from "vue";
import CtcUI from "@ctc-front/components-ui";

Vue.use(CtcUI, {
	// 启用主题配置
	theme: {
		enabled: true, // 开启主题功能
		default: "lightTheme",
		list: {
			lightTheme: {
				title: "Light",
				vars: {
					/* ... */
				},
			},
		},
	},
});

2. 按需引入 (Tree Shaking)

组件库支持基于 ES Module 的 Tree Shaking，允许只引入项目中实际使用的组件，从而减小打包体积。

每个组件都可以单独导入：

/* main.js */
import Vue from "vue";
import { CtcTable, CtcDialog, CtcDrawer } from "@ctc-front/components-ui";

// 注册组件
Vue.use(CtcTable);
Vue.use(CtcDialog);
Vue.use(CtcDrawer);