以vant框架为例,vue项目以less作为css处理器:

less/var-reset.less

@import '~vant/lib/index.less';

// Color variables 重写变量值
@blue: #1989fa;
@orange: #000;
@green: #cccccc;

vue入口文件:

import vant from 'vant';
import '../../less/var-reset.less'; // 引入var-reaet.less文件
Vue.use(vant);

vue文件:

Hello admin
<van-button type="default">默认按钮</van-button>
<van-button type="primary">主要按钮</van-button>
<van-button type="warning">警告按钮</van-button>
<van-button type="danger">危险按钮</van-button>

结果:

aaarticlea/png;base64,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" alt="" />

vue 修改框架less变量的更多相关文章

  1. vue修改框架样式/deep/

    /deep/ 父元素的样式名 /deep/ 要修改的样式名 使用 ... 貌似不行

  2. upload 上传 加token 在 :headers='headers' 注意 不要直接写$refs.upload.headers = {} 这样vue会警告 修改组件内部变量

    upload 上传 加token 在 :headers='headers' 注意 不要直接写$refs.upload.headers = {} 这样vue会警告 修改组件内部变量 <Upload ...

  3. 后盾网lavarel视频项目---4、lavarel和vue都是{{}}表示变量,如何解决冲突

    后盾网lavarel视频项目---4.lavarel和vue都是{{}}表示变量,如何解决冲突 一.总结 一句话总结: @{{videos}}:@符号表示lavarel不处理:textarea nam ...

  4. vue 前端框架 目录

    vue 前端框架 目录   vue-目录 ES6基础语法 vue基础语法 Vue.js的组件化思想 —上 Vue.js的组件化思想 —下 Vue + Vue-Router结合开发 SublimeSer ...

  5. Vue项目框架

    Vue项目框架 基本组件的使用: new Vue({ el, //要绑定的DOM element data, //要绑定的资料 props, //可用来接收父原件资料的属性 template, //要 ...

  6. 使用Vue+JFinal框架搭建前后端分离系统

    前后端分离作为Web开发的一种方式,现在应用越来越广泛.前端一般比较流行Vue.js框架,后端框架比较多,网上有很多Vue+SpringMVC前后端分离的demo,但是Vue+JFinal框架貌似没有 ...

  7. 直播课(1)如何通过数据劫持实现Vue(mvvm)框架

    19.6.28更新: 这篇博客比较完善:将每一部分都分装在单独的js文件中: 剖析Vue原理&实现双向绑定MVVM 半个月前看的直播课,现在才自己敲了一遍,罪过罪过 预览: 思路: 简单实现V ...

  8. vue修改elementUI的分页组件视图没更新问题

    转: vue修改elementUI的分页组件视图没更新问题 今天遇到一个小问题平时没留意,el-pagination这个分页组件有一个属性是current-page当前页.今天想在methods里面手 ...

  9. 怎样修改Windows7环境变量

    在使用电脑的时候要运行某些特定的应用程序时需要修改系统的环境变量,例如安装JAVA时我们就需要配置系统的环境变量.那什么是环境变量呢?环境变量一般是指在操作系统中用来指定操作系统运行环境的一些参数,比 ...

随机推荐

  1. 白话SpringCloud | 第十一章:路由网关(Zuul):利用swagger2聚合API文档

    前言 通过之前的两篇文章,可以简单的搭建一个路由网关了.而我们知道,现在都奉行前后端分离开发,前后端开发的沟通成本就增加了,所以一般上我们都是通过swagger进行api文档生成的.现在由于使用了统一 ...

  2. 【ubuntu】更换下载源

    ubuntu,我们在使用apt新装软件的时候,会使用官方的网站去下载软件,但是会因为国内的转接点太多,而导致下载的速度非常慢 ,我们可以通过换成一些中间的节点来进行下载,比如阿里源,中科大源,清华源等 ...

  3. 深入理解JavaScript系列(34):设计模式之命令模式

    介绍 命令模式(Command)的定义是:用于将一个请求封装成一个对象,从而使你可用不同的请求对客户进行参数化:对请求排队或者记录请求日志,以及执行可撤销的操作.也就是说改模式旨在将函数的调用.请求和 ...

  4. C# 使用cookie实现登录

    首先,我们需要做的是什么? 我们成功登录之后,跳转到主界面,然后主界面的登录按钮变成头像啥的.下一次打开网页就要判断有没有登录过,有cookie就不需要登录,直接显示头像 1.成功登录后,客户端请求服 ...

  5. asp.net FileUpload上传文件夹并检测所有子文件

    1.在FileUpload控件添加一个属性 webkitdirectory=""就可以上传文件夹了 <asp:FileUpload ID="FileUpload1& ...

  6. WCF寄宿在C#控制台,并用命令行启动

    公司运用wcf比较多,所以自己研究一下寄宿做个笔记,wcf寄宿在控制台有两种方式 第一种,直接在控制台程序内添加wcf服务. 第二种分别添加控制台程序和wcf服务应用程序,前者引用后者,并在app.c ...

  7. hdu 1255 矩形覆盖面积(面积交)

    http://www.cnblogs.com/scau20110726/archive/2013/04/14/3020998.html 面积交和面积并基本上差不多.在面积并里,len[]记录的是覆盖一 ...

  8. php自建静态博客步骤

    进入博客目录新建index.php页面 <?php require “XXXX/index.html”;//引入html页面 是否能进入localhost/xxx/index.php 注意,ph ...

  9. angular1结合webpack构建工具

    目录结构 webpack.config.js const { resolve } = require('path') const webpack = require('webpack') const ...

  10. 关于js 中函数的参数

    var a = 100; function test(a){ a++; //a(形参)是局部变量 console.log(a); } test(a); console.log(a); //结果是 10 ...