vue-cli2定制ant-design-vue主题

本篇是vue-cli2定制主题,vue-cli3通过vue.config.js定制主题点击此处
1.引入less和less-loader(如果报错,请将less-loader版本更改到5.0.0)

npm install less less-loader --save

2.在 vue cli 2 中定制主题,修改build/utils.js文件

less: generateLoaders("less", {modifyVars: {"primary-color": "#1DA57A", // 全局主色"link-color": "#f5222d", // 链接色"success-color": "#52c41a", // 成功色"warning-color": "#faad14", // 警告色"error-color": "#f5222d", // 错误色"font-size-base": "14px", // 主字号"heading-color": "rgba(0, 0, 0, 0.85)", // 标题色"text-color": "rgba(0, 0, 0, 0.65)", // 主文本色"text-color-secondary": "rgba(0, 0, 0, 0.45)", // 次文本色"disabled-color": "rgba(0, 0, 0, 0.25)", // 失效色"border-radius-base": "4px", // 组件/浮层圆角"border-color-base": "#d9d9d9", // 边框色"box-shadow-base": "0 2px 8px rgba(0, 0, 0, 0.15)" // 浮层阴影},javascriptEnabled: true}),

在这里插入图片描述

3.注意样式必须加载 less 格式

  • 如果你在使用 babel-plugin-import 的 style 配置来引入样式,需要将配置值从 ‘css’ 改为 true,这样会引入 less 文件。
  • 如果你是通过 ‘ant-design-vue/dist/antd.css’ 引入样式的,改为 ant-design-vue/dist/antd.less。

4.重启项目即可(每次设置主题色后需要重新才可以看到效果)

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/403833.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

python中thread的setDaemon、join的用法

From: http://doudouclever.blog.163.com/blog/static/17511231020127232303469/ python中得thread的一些机制和C/C不同:在C/C中,主线程结束后,其子线程会默认被主线程kill掉。而在python中,主线程结束后,会默认等待子…

谈谈软件兼容性测试

1.软件兼容性测试兼容性测试之待测试项目在特定的硬件平台上,不同的应用软件不同,不同的操作系统平台上,在不同的网络等环境中能正常的运行的测试。兼容性测试的目的:带测试项目在不同的操作系统上正常运行,包括待测试…

YUV视频格式分析

Andrew Huang <bluedrum163.com> 转载请注明作者及联络方式在摄像头之类编程经常是会碰到YUV格式,而非大家比较熟悉的RGB格式. 我们可以把YUV看成是一个RGB的变种来理解.YUV的原理是把亮度与色度分离&#xff0c;研究证明,人眼对亮度的敏感超过色度。利用这个原理&#x…

自定义ant中table表格的展开图标 修改ant-vue-design中嵌套表格table的expandIcon自定义图标

效果&#xff1a; 1. <a-table:expandIcon"expandIcon":loading"loading":columns"columns":data-source"data"class"components-table-demo-nested"change"onChangeTable":scroll"{x:1300,y:y}":p…

Foundationd和Application Kit的类层次

Foundationd类 Application Kit类 转载于:https://www.cnblogs.com/ikodota/archive/2012/08/01/2618590.html

python多线程编程(1): python对多线程的支持

From: http://www.cnblogs.com/holbrook/archive/2012/03/01/2376408.html 前面介绍过多线程的基本概念&#xff0c;理解了这些基本概念&#xff0c;掌握python多线程编程就比较容易了。 在开始之前&#xff0c;首先要了解一下python对多线程的支持。 虚拟机层面 Python虚拟机…

三个数从小到大排序

描述 现在要写一个程序&#xff0c;实现给三个数排序的功能 输入输入三个正整数 输出给输入的三个正整数排序 样例输入20 7 33 样例输出 7 20 33 测试代码 1 #include "stdio.h"2 3 int main()4 {5 int a, b, c, t;6 scanf("%d%d%d", &a, &…

监听vuex的某条数据

需要现在计算属性里获取 computed: {tabType: {get() {return this.$store.state.tabType;},set(val) {this.$store.state.tabType val;},}},watch: {tabType(val) {this.allType this.$store.state.tabType;}, }

dup和dup2的使用方法

/*本文通过标准输出的重定向和恢复的过程来解释dup和dup2的使用方法*/#include <stdio.h> #include <unistd.h>#include <fcntl.h>//STDIN_FILENO标准输入描述符&#xff08;0&#xff09;//STDOUT_FILENO标准输出描述符&#xff08;1&#xff09; //STDERR_…

django时间问题和时区设置

django里默认设置了一个时区&#xff0c;我在django里调time获取时间&#xff0c;与系统时间出现不一致的情况&#xff0c;所以我们需要重启设置时区&#xff0c;如下&#xff1a;在settings.py里面把TIME_ZONE设为&#xff1a;Etc/GMT-8 转载于:https://blog.51cto.com/linuxs…

python多线程编程(2): 线程的创建、启动、挂起和退出

From: http://www.cnblogs.com/holbrook/archive/2012/03/02/2376940.html 如上一节&#xff0c;python的threading.Thread类有一个run方法&#xff0c;用于定义线程的功能函数&#xff0c;可以在自己的线程类中覆盖该方法。而创建自己的线程实例后&#xff0c;通过Thread类的…

记录ie下报XMLHttpRequest: 网络错误 0x80070005, 拒绝访问。

问题&#xff1a; 同样的调用接口&#xff0c;在谷歌是没有问题的&#xff0c;但是在ie下报错XMLHttpRequest: 网络错误 0x80070005, 拒绝访问。 1.分析&#xff1a; 对比了一下&#xff0c;相同的是接口传递参数错误导致报错&#xff0c;传递的参数自动带上了 " "…

getopt和getopt_long函数

平时在写程序时常常需要对命令行参数进行处理&#xff0c;当命令行参数个数较多时&#xff0c;如果按照顺序一个一个定义参数含义很容易造成混乱&#xff0c;而且如果程序只按顺序处理参数的话&#xff0c;一些“可选参数”的功能将很难实现。 在Linux中&#xff0c;我们可以使…

MVC3.0+DWZ探索

将themes 文件移到 js文件 index.html 转载于:https://www.cnblogs.com/acyy/archive/2012/08/03/2621594.html

棋盘覆盖

在一个2k x 2k ( 即&#xff1a;2^k x 2^k )个方格组成的棋盘中&#xff0c;恰有一个方格与其他方格不同&#xff0c;称该方格为一特殊方格&#xff0c;且称该棋盘为一特殊棋盘。在棋盘覆盖问题中&#xff0c;要用图示的4种不同形态的L型骨牌覆盖给定的特殊棋盘上除特殊方格以外…

VMM2012应用指南之12- 创建自助服务用户并分配云

河北经贸大学 王春海如果要在云中创建、管理虚拟机&#xff0c;首先要创建自助服务帐户&#xff0c;在创建用户角色的同时即可以分配云。本节介绍这部分内容。【说明】在做下面的这个操作的时候&#xff0c;需要向“库”服务器再添加另外一个库的路径&#xff0c;用于保存云中的…

分隔符字符串处理(strtok与strsep区别)

1、strtok原型与应用原型&#xff1a;char *strtok(char *src, const char *delim);功能&#xff1a;将src(原字符串)根据delim(分隔符串)分解为不同子串&#xff08;连续算一个&#xff09;返回&#xff1a;属于当前分割的子串&#xff0c;当前没有分割的子串时返回NULL#inclu…

解决vue项目在ie浏览器下白屏问题;ie运行项目报正在兼容性是图中运行,因为选中了“在兼容性视图中显示Intranet站点”

如果已经配置了babel-polyfill&#xff0c;在ie下依然白屏&#xff0c;打开控制台刷新&#xff0c;看看是否报 正在兼容性是图中运行&#xff0c;因为选中了“在兼容性视图中显示Intranet站点” 如图 解决方案 在ie浏览器—设置—兼容性视图设置&#xff08;B&#xff09;…

第六次java作业

package choujiang; import java.util.ArrayList; import java.util.Collections; import java.util.Random; public class ChouJiang { private ArrayList List; public void deal(){ //向List容器中顺序添加指定数量num的整数 if (List null){ List new ArrayList(); for(i…