修改vant的less样式变量
引入全局cssimport ‘vant/lib/index.css’;引入单个组件样式import ‘vant/lib/toast/style/less’;新建一个less文件,用于修改vant的less变量如conver_vant.less,在里面修改变量//toast@toast-background-color:blue;@action-sheet-max-height:80%!import
·
引入全局css
import ‘vant/lib/index.css’;
引入单个组件样式
import ‘vant/lib/toast/style/less’;
新建一个less文件,用于修改vant的less变量
如conver_vant.less,在里面修改变量
//toast
@toast-background-color:blue;
@action-sheet-max-height:80%!important;
在vue.config.js里按照官方提示配置
这里注意要使用绝对路径,并且@import 后面记得跟双引号""。
const path = require('path')
module.exports = {
css:{
loaderOptions:{
less:{
modifyVars:{
//通过本地less文件覆盖变量
// true; @import "your-less-file-path.less";
hack:`true;@import "${path.resolve(__dirname,'./src/common/cover_vant.less')}";`
}
}
}
}
}
修改完重新运行npm run serve才能看到效果。
更多推荐
已为社区贡献2条内容
所有评论(0)