uni-app项目中如何使用scss less

前言: 由于公司业务调整,特意学习下uni项目框架,其实根据官方api就是实现很多功能,其实都是一些小坑要走,下面来说一下uni项目中如何使用scss

vue编写中我们可以直接使用下面这样方法,多方便

<style lang="scss" scoped>
.module {
    margin: 18px 30px 0;
    padding-bottom: 30px;
    border-radius: 18px;
    &.color {
      background-color: #fff;
    }
    &.bg {
      // background: url('../assets/c-topbg.png');
      background-repeat: no-repeat;
      background-size: 100%;
    }
    .module_title {
      display: flex;
      align-items: baseline;
      .title {
        margin: 24px 18px 0 24px;
        font-size: 36px;
        font-weight: 600;
        color: #333333;
        line-height: 50px;
      }
      .tip {
        font-size: 24px;
        color: #999999;
        line-height: 33px;
      }
    }
  }
</style>

uni中如何使用呢?
首先使用模板 下载依赖 (这里说下可以使用 yarn or cnpm i or npm i)  然后统一使用命令下载

执行以下命令:
npm i node-sass@4.14.1 sass-loader@7 -D

就可以向上面代码那样使用啦。

原创不易 来个小赞  biubiubiu...

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值