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都改为空就可以啦!
相关推荐
walking9573 分钟前
重新学习前端之设计模式与架构
前端·javascript·面试
walking9576 分钟前
重新学习前端之TypeScript
前端·javascript·面试
walking9576 分钟前
重新学习前端之Linux
前端·vue.js·面试
walking9577 分钟前
重新学习前端之CSS
前端·vue.js·面试
walking9577 分钟前
重新学习前端之Git
前端·vue.js·面试
walking9577 分钟前
重新学习前端之小程序
前端
魔术师Grace9 分钟前
AI让我退化成原始人了
前端·程序员
铁皮饭盒10 分钟前
今天你会学到这些关键词
前端·后端
李剑一11 分钟前
耗时 2 小时!我复刻了全网超火的通透 3D 水晶球动效,Vue3+Three.js 做出高级视觉特效
前端·three.js
oil欧哟18 分钟前
🤔 很长时间没写文章了,分享一下最近的一些思考
前端·后端