JCJY Components

Vue 3 组件库，当前版本为纯 Vue 组件实现，不依赖 Element Plus 与 TailwindCSS。

安装

npm install jcjy-components
# 或
pnpm add jcjy-components
# 或
yarn add jcjy-components

依赖要求

• Vue 3.0+

使用方法

1. 插件方式（推荐）

import { createApp } from "vue";
import App from "./App.vue";
import JcjyComponents from "jcjy-components";
import "jcjy-components/style.css";

const app = createApp(App);
app.use(JcjyComponents);
app.mount("#app");

2. 按需导入组件

import { AuthGateway } from "jcjy-components";
import "jcjy-components/style.css";

export default {
  components: {
    AuthGateway,
  },
};

TypeScript 支持

本库已内置类型声明，TS 项目可直接获得类型提示。

import type { AuthGatewayConfig } from "jcjy-components";

样式说明

• 请在宿主项目入口显式引入：import 'jcjy-components/style.css'
• 虽然组件已脱离 TailwindCSS 与 Element Plus，但样式仍会打包到 dist/jcjy-components.css
• 因此接入方仍必须引入：import 'jcjy-components/style.css'
• 不需要额外引入第三方 UI 样式库

组件列表

AuthGateway 认证网关

统一的认证组件，支持多种登录方式。

<template>
  <AuthGateway
    :config="config"
    :binding="binding"
    :login="login"
    :register="register"
    :wechat-config="wechatConfig"
  />
</template>

主题工具

import { theme } from "jcjy-components";

// 设置主题
await theme.setTheme("#409EFF");

// 根据 URL 参数设置主题
await theme.setThemeByUrl();

产物说明

发布包默认包含以下关键文件：

• dist/index.es.js（ESM）
• dist/index.umd.cjs（CJS）
• dist/jcjy-components.css（样式）
• dist/index.d.ts（类型声明）

注意事项

1. 宿主项目需要自行安装 vue（peerDependencies）
2. 当前版本无需安装 tailwindcss 与 element-plus
3. 若发布到 npm，请使用：pnpm push:npm

许可证

MIT License