@gdkf/cli-theme
主题生成工具.
当前版本仅支持 kfui-terminal@2.6.x , kfui-terminal@2.5.x 系列不支持主题生成;
Installation
全局安装脚手架
npm i @gdkf/cli-theme -g
安装主题包
npm i @gdkf/theme-terminal-v2 -D
CLI
# 初始化变量文件
kt --init [file path]
# 生成主题
kt [--config variable file path] [--out theme path]
Options
config
Variable file path(变量文件路径), default ./kamfu-variables.scss
.
out
Theme output path(生成的主题路径), default ./theme
.
Examples
安装依赖
# 全局安装主题生成工具
npm i @gdkf/cli-theme -g
# 安装开发依赖-主题包
npm i @gdkf/theme-terminal-v2 -D
# 安装生产依赖-组件库(2.6.*)
npm i kfui-terminal
在项目中应用
在
kfui-terminal@2.6.x
中使用
-
执行
kt --init
指令初始化变量文件,默认会在项目根目录生成./kamfu-variables.scss
文件# 初始化变量文件 kt --init
-
修改
./kamfu-variables.scss
文件中的主题对应的颜色值 -
执行
kt
指令生成主题,默认会在项目根目录中生成./theme
主题文件夹# 生成主题 kt
-
在main.js引入生成的主题css
// 引入elementUI,不需要引入element-ui的css文件 import Element from 'element-ui' import Viewer from 'viewerjs' import 'viewerjs/dist/viewer.css' import { TweenLite } from 'gsap' import KamfuUI from 'kfui-terminal' // import 'kfui-terminal/lib/theme-chalk/index.css' // 默认主题 import '../theme/index.css' // 引入生成的主题包,主题包位置可自行存放 Vue.prototype.$Viewer = Viewer Vue.prototype.$TweenLite = TweenLite Vue.use(Element) Vue.use(KamfuUI)
License
MIT