React - sass配置

1. idea下载Easy Sass插件:

2. 启用后,我们写的scss文件不能直引用,所以还要下载sass依赖:

(推荐使用.scss,因为与原生.css写法接近,.sass格式更严格)

javascript 复制代码
// 下载sass依赖
npm install sass sass-loader --save-dev

3. 之后我们可以直接引入scss文件了,但是还有一点就是我们写scss会自动编译为.css以及min.css,这样看起来有点不够优雅:

我们只需要引入.scss, .css, .min.css其中一个就可以生效,为了较少代码冗余,我们只需要保留引用scss文件即可,取消默认生成.css以及.min.css文件。

4. vscode配置插件,取消默认生成 .css以及 .min.css文件:

  • 打开设置。
  • 输入easysass找到插件设置 - 点击edit in setting.json,通过代码来修改配置。
  • 最后把false,formats里的extension都改为空就可以啦!
相关推荐
lpfasd1234 分钟前
TypeScript + Cloudflare 全家桶部署项目全流程
前端·javascript·typescript
ZC跨境爬虫8 分钟前
极验滑动验证码自动化实战:背景提取、缺口定位与Playwright滑动模拟
前端·爬虫·python·自动化
前端Hardy24 分钟前
字节/腾讯内部流出!Claude Code 2026王炸玩法!效率暴涨10倍
前端·javascript·vue.js
糟糕好吃30 分钟前
AI 全流程解析(LLM / Token / Context / RAG / Prompt / Tool / Skill / Agent)
前端·后端·设计模式
快手技术36 分钟前
快手广告系统全面迈入生成式推荐时代!GR4AD:从Token到Revenue的全链路重构
前端·后端
前端Hardy36 分钟前
大厂都在偷偷用的 Cursor Rules 封装!告别重复 Prompt,AI 编程效率翻倍
前端·javascript·面试
kyriewen38 分钟前
Vite:比Webpack快100倍的“闪电侠”,原理竟然这么简单?
前端·javascript·vite
竹林81838 分钟前
RainbowKit快速集成多链钱包连接:从“连不上”到丝滑切换的踩坑实录
前端·javascript
小小小小宇1 小时前
前端看go并发
前端
前端Hardy1 小时前
Cursor Rules 完全指南(2026 最新版)
前端·javascript·面试