自定义主题

如果你项目使用scss/sass来编写样式的话，你完全可以定义一套属于自己的主题风格。

创建

新建一个样式文件，如：theme-style.scss

/* 改变主题色变量 */
$--color-primary: blue;

/* 导入字体文件 必须*/
$--font-path: '~spotlight-ui/lib/font';
/* 导入Spotlight的主题文件*/
@import "~spotlight-ui/packages/theme/src/index.scss";

使用

import Vue from 'vue';
// 导入 Spotlight
import Spotlight from "spotlight-ui";
// 无须引入Spotlight的css样式文件
// import 'spotlight-ui/lib/style/index.css';
import './theme-style.scss';
import App from './App.vue';

// 引用
Vue.use(Spotlight);

new Vue({
  el: '#app',
  render: h => h(App)
});

完成

你会发现主题色已经变为蓝色了。