在webstorm中配置sass编译环境

1.下载ruby

        下载地址:ruby下载

        

                           

2.安装ruby

        下载之后,有一个exe安装包

        双击exe文件 ,并选择自己的安装位置这个位置一定要记得,需要在webstorm中使用)。其他的步骤默认安装即可。

3.安装sass

        ruby安装成功后,打开cmd命令行,输入 gem install sass ,回车后进行安装步骤(一定要保证网络稳定,不然可能安装失败)。

        安装成功后会在末尾显示:5 gems installed。然后输入 sass -v 查看版本号,如果有版本号则表示安装成功,如果没有则表示没成功,则需要重新安装。

        打开ruby 安装路径的文件夹,在bin文件可以看到sass.bat和scss.bat文件。这个文件很重要,需要在webstorm中配置

4. 在webstorm中配置sass环境

        以上ruby和sass都安装成功之后,就开始配置webstorm。

这样就配置好了。

5. 测试

        在webstorm中建立文件scss文件测试。

         注意: 这里文件名后缀是scss噢,不要写成sass了

建立之后会自动生成.css文件和css.map文件即可,里面的写的sass样式会转为css样式。

在html界面引用的时候还是引用css后缀的文件。

备注:

        原文:在webstorm中配置sass的开发编译环境_webstorm编译sass-CSDN博客

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/149663.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

记feign调用第三方接口时header是multipart/form-data

1.请求第三方接口,用feign请求 请求第三方接口,用feign请求,header不通,feign的写法不同 调用时报错Could not write request: no suitable HttpMessageConverter found for request type [com.ccreate.cnpc.mall.dto.zm.ZMPage…

程序员的护城河:技术深度、创新精神与软实力的完美结合

文章目录 1. 技术深度:建立坚实的技术基石2. 创新精神:应对变革的利器3. 软实力:沟通协作构筑团队防线4. 结合三者构筑完美护城河 🎉程序员的护城河:技术深度、创新精神与软实力的完美结合 ☆* o(≧▽≦)o *☆嗨~我是I…

【Maven】进阶

文章目录 1. 聚合2. 继承3. 属性变量定义与使用4. 版本管理5. 资源配置6. 多环境配置7. 跳过测试(了解) 1. 聚合 为了防止某个模块(dao)更新了,重新编译了,导致和其他模块不兼容,需要用一个roo…

移植freertos到qemu上运行

1、freertos源码下载 参考博客:《freertos源码下载和目录结构分析》; 2、编译freertos 2.1、选择合适的Demo freertos官方已经适配过qemu,所以我们并不需要做源码级别的移植,只需要选择合适的Demo文件夹。 2.2、修改Makefile 2.3…

sCrypt 发布零知识证明精选列表

sCrypt 发布了与零知识证明相关的精选列表,包括:教程,编程语言,工具,书籍,社区,证明系统。欢迎收藏 github 代码仓:https://github.com/sCrypt-Inc/awesome-zero-knowledge-proofs。…

spark与scala的对应版本查看

仓库地址 https://mvnrepository.com/artifact/org.apache.spark/spark-core 总结 spark3.0 以后,不再支持 scala2.11spark3.0 以后,只能用 scala2.12以上

Zabbix邮箱告警

1.在邮箱中获取授权码 2.zabbix配置 agengt配置 添加以下配置 [rootserver03 ~]# visudo zabbix ALL(ALL) NOPASSWD: ALL [rootserver03 ~]# vim /etc/zabbix/zabbix_agentd.conf EnableRemoteCommands1 #允许接收远程命令 修改原有的值,不要在末…

Windows系统CMake+VS编译protobuf

目录 一些名词CMake构建VS工程下载protobuf源码下载CMake编译QT中使用 方案二失败:CMakeQT自带的Mingw编译参考链接 一些名词 lib dll lib库实际上分为两种,一种是静态链接lib库或者叫做静态lib库,另一种叫做动态链接库dll库的lib导入库或称…

.Net8 Blazor 尝鲜

全栈 Web UI 随着 .NET 8 的发布,Blazor 已成为全堆栈 Web UI 框架,可用于开发在组件或页面级别呈现内容的应用,其中包含: 用于生成静态 HTML 的静态服务器呈现。使用 Blazor Server 托管模型的交互式服务器呈现。使用 Blazor W…

LINMP搭建wordpress-数据库不分离

目录 一、nginx部署 1.安装nginx前的系统依赖环境检查 2.下载nginx源代码包 3.解压缩源码包 4.创建普通的nginx用户 5.开始编译安装nginx服务 6.创建一个软连接以供集中管理 7.配置nginx环境变量 二、mysql 1.创建普通mysql用户 2.下载mysql二进制代码包 3.创建mys…

吴恩达《机器学习》8-5->8-6:特征与直观理解I、样本与值观理解II

8.5、特征与直观理解I 一、神经网络的学习特性 神经网络通过学习可以得出自身的一系列特征。相对于普通的逻辑回归,在使用原始特征 x1​,x2​,...,xn​ 时受到一定的限制。虽然可以使用一些二项式项来组合这些特征,但仍然受到原始特征的限制。在神经网…

【MySQL】MVCC(多版本并发控制)详解

MVCC MVCC概述 MVCC,全称 Multi-Version Concurrency Control ,即多版本并发控制。MVCC 是一种并发控制的方法,一般在数据库管理系统中,实现对数据库的并发访问,在编程语言中实现事务内存。 MVCC就是在ReadCommitte…

echarts实现不展示X轴Y轴轴线、刻度

今日工作中需要实现折线图的简图,就是只看个大概趋势不展示具体坐标,查阅了文档记录一下。 initCharts(_id, _name, yAxisData, _unit){if(this[_id]) this[_id].clear();this[_id] $echarts.init(document.getElementById(_id));const options {grid…

基于Springboot+Vue的社区医院管理系统

基于SpringbootVue的社区医院管理系统的设计与实现~ 开发语言:Java数据库:MySQL技术:SpringBootMyBatisVue工具:IDEA/Ecilpse、Navicat、Maven 系统展示 主页 医生列表 医生详情 登录界面 管理员界面 医生界面 摘要 社区医院管…

van-dialog弹窗异步关闭-校验表单

van-dialog弹窗异步关闭 有时候我们需要通过弹窗去处理表单数据,在原生微信小程序配合vant组件中有多种方式实现,其中UI美观度最高的就是通过van-dialog嵌套表单实现。 通常表单涉及到是否必填,在van-dialog的确认事件中直接return是无法阻止…

POE也收费了

一直通过POE在用chatgpt,今天下午发现要收费了…

二百零三、Flume——Flume实时采集数据频率为1s的高频率Kafka数据直接写入ODS层表的HDFS文件路径下

一、目的 在离线数仓中,需要用Flume去采集Kafka中的数据,然后写入HDFS中。 由于每种数据类型的频率、数据大小、数据规模不同,因此每种数据的采集需要不同的Flume配置文件。玩了几天Flume,感觉Flume的使用难点就是配置文件 二、…

【MATLAB源码-第78期】基于matlab的可见光通信不同调制方式(OOK,PPM,DPPM,DHPIM)误码率,信道容量分析。

操作环境: MATLAB 2022a 1、算法描述 可见光通信(VLC,Visible Light Communication)是一种利用可见光作为信号载体的通信技术。在VLC中,常用的调制方式包括OOK(On-Off Keying)、PPM&#xff…

【C++初阶】三、类和对象(面向过程、class类、类的访问限定符和封装、类的实例化、类对象模型、this指针)

相关代码gitee自取: C语言学习日记: 加油努力 (gitee.com) 接上期: 【C初阶】二、入门知识讲解 (引用、内联函数、auto关键字、基于范围的for循环、指针空值nullptr)-CSDN博客 一 . 面向过程和面向对象初步认识 C语言 -- 面向…

【力扣题:循环队列】

文章目录 一.题目描述二. 思路解析三. 代码实现 一.题目描述 设计你的循环队列实现。 循环队列是一种线性数据结构,其操作表现基于 FIFO(先进先出)原则并且队尾被连接在队首之后以形成一个循环。它也被称为“环形缓冲器”。 循环队列的一个好…