html静态页面中引入scss的样式调整

问题:静态页面样式和vue动态页面的样式不统一。截图了一个角落:
需求:静态页面的样式要和动态页面的一样
解决步骤:
  1. F12 查看样式文件引用的区别

  1. 找到vue动态页面中的样式区别是在vue项目中用了自带的scss文件

  1. 将文件引入到静态页面的文件夹中,发现新的问题,如下:

原因是html文件中不能引入scss文件

  1. 查阅资料后解决方式:

①、静态页面对应的scss文件夹下安装sass

npm install -g sass

②、使用sass将scss文件转换成css文件

sass argon.scss .\css\argon.css 【意思是:将argon.scss文件转成argon.css,并放在同级的css文件夹中】

③、最后再在页面head中引入这个转换后的css文件即可解决!

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值