Vue 2.5.2引入Vant 2.5.9定制主题

    技术2022-07-10  119

    1.在vue中的main.js中引入vant,当然要先安装Vant,注意引入的是index.less,不是index.css,这个位置很多人忽略。

    import 'vant/lib/index.less' import Vant from 'vant' Vue.use(Vant)

    2.修改 .babelrc 文件,增加

    "plugins": ["transform-vue-jsx", "transform-runtime"]

    3.參照Vant的定制主题,复制里面的theme.less文件到Vue项目的本地 4.修改utils.js 文件,替换less,主要是对应theme.less主题文件

    less: generateLoaders('less',{ modifyVars: { 'hack': `true; @import "${path.join(__dirname,'../src/style/theme.less')}";` }}),

    5.然后修改主题文件里的样式,就能统一修改组件的样式了。

    Processed: 0.010, SQL: 9