位置: IT常识 - 正文

将scss文件转换成css文件(sass转化为css)

编辑:rootadmin
将scss文件转换成css文件

推荐整理分享将scss文件转换成css文件(sass转化为css),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:sch如何转成dsn文件,sch文件转换为pdf文件,用scss如何自动生成css,怎么把文件转换成scs格式,sass转化为css,.scss文件,scss转为css,scss转为css,内容如对您有帮助,希望把文章链接给更多的朋友!

大家平时做项目肯定都习惯了使用scss或者less去写样式,如果是使用工程化的项目我们可以借助插件很方便的将scss或者less转换成css。那如果我们没有使用工程化,比如简单的demo或者官网等项目又希望可以通过scss去编写文件应该怎么办呢,我们可以借助sass插件去帮我们转换生成css样式文件,原理和工程化其实是一样的,只是我们手动的去触发了sass的能力。

1.安装sass将scss文件转换成css文件(sass转化为css)

首先在我们的项目下安装sass

npm i sass2.使用命令转译scss或sass文件

假设我们的页面都在page目录下,每个页面为一个文件夹,存放的是html文件和scss文件,例如下面的index 在index.html文件中我们无法直接使用scss文件,所以我们可以使用下面的命令先将scss文件转译为css文件:

sass .\index.scss .\index.css

注意控制台的起始路径,路径拼接以后一定要指向一个具体的文件。假如我的项目名为demo,它存放在D盘的project文件夹下,我的控制台的窗口显示起始路径假设为D:\project,那么我们的命令应该更改为:

sass .\demo\page\index\index.scss .\demo\page\index\index.scss

运行这段命令后sass会将我们指定的scss文件转换为css文件 这个时候我们就可以在html中引入转换好的css文件

3.监听scss变化更新css文件

在开发中如果我们总是手动输入命令去生成css文件这肯定是让人无法忍受的,所以我们可以借助一个指令去完成监听,它就是--watch,当我们输入如下命令时

sass --watch .\demo\page\index\index.scss .\demo\page\index\index.scss

这个时候就会开启指定文件的更改监听,每当我们更改保存index.scss文件时,index.css都会自动被更新。

本文链接地址:https://www.jiuchutong.com/zhishi/289708.html 转载请保留说明!

上一篇:【计算机网络】网络层IP协议(计算机网络拓扑结构有哪些)

下一篇:关于oss使用sts 后台签发临时token前端直传大文件的错误记录(oss使用场景)

  • 家里财产分割
  • 餐饮业购买的油类有哪些
  • 季中转一般纳税人申报步骤
  • 税控盘锁死日期查询
  • 银行开户费用计入
  • 生产企业出口转内销增值税申报
  • 跨年的费用怎么调整
  • 公司账外现金
  • 非正常损失会计利润调整
  • 产成品返工如何处理
  • 支付利息的诉讼请求
  • 用于在建工程的贷款利息
  • 投入的资金计入什么科目
  • 经营现金流动比率公式
  • 啤酒的税率是多少2022
  • 商贸有限公司要报地税吗
  • 工程改造合同印花税
  • 企业所得税审计的内容包括哪四个方面
  • 增值税税负最终由谁承担
  • 公司个税申报是什么意思
  • 出租设备计提折旧记什么科目
  • 当月支付的费用需要计提吗
  • 工伤保险公司缴纳部分为何是0
  • 会计分录中结转成本
  • 2020最新win10密钥
  • thinkphp怎么用
  • 员工工伤一次性赔偿会计分录
  • 跨境服务免征增值税申报怎么填
  • yolov5 c
  • PHP:imagecolordeallocate()的用法_GD库图像处理函数
  • 蒂内河畔圣艾蒂安小镇,法国阿尔卑斯省 (© CAVALIER Michel/hemis.fr/Alamy Stock Photo)
  • 存货出入库的账务处理
  • 地税没申报罚款多少
  • 结转,结余
  • 读懂spring源码
  • high-resolution image synthesis with latent diffusion models
  • 文心一言中国版
  • python搭建项目结构
  • 销售建材行业
  • 印花税账务处理会计分录
  • sql serverjdbc
  • 企业年报股东出资信息
  • 应付职工薪酬期末余额是什么意思
  • 增值税专用发票有几联?
  • 受疫情影响较大的困难行业企业2020
  • 结转成本应附什么原始凭证
  • 可以抵扣进项税的项目包括
  • 哪些税费计入税金及附加科目
  • 外账会计做什么
  • 物流行业会计核算特征有哪些
  • mysql查询语句大全讲解
  • 模糊查询的通配符有哪些
  • SqlServer下通过XML拆分字符串的方法
  • windows7更新80072efe
  • win7系统的笔记本电脑有哪些
  • solaris newfs
  • host文件内容
  • winpatrol.exe - winpatrol是什么进程
  • 重装Windows11
  • Linux系统下以模块方式安装卸载文件系统
  • 五个常用的说明方法
  • centos安装rclone
  • windows7的使用方法
  • Win10 Mobile RS1预览版14267.1004升级过程截图
  • android ui绘制
  • css网站布局实录 pdf
  • node.js deno
  • Unity 相关经典博客资源总结(持续更新)
  • 你有一份来信
  • windows、linux
  • pm2启动nodejs
  • js中切割字符串
  • JavaScript中的变量名不区分大小写
  • javascript五种数据类型
  • python读取大txt文件
  • jquery访问本地html
  • 税务局收垃圾处置费
  • 如何知道公司所有账户
  • 股权收购的好处
  • 信托公司抵押房能买吗
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设