sass使用

最新推荐文章于 2024-05-18 09:58:31 发布

永恒 Eternally

最新推荐文章于 2024-05-18 09:58:31 发布

阅读量461

点赞数

分类专栏：技术分享文章标签： sass 前端 css

本文链接：https://blog.csdn.net/qq_50648993/article/details/125625137

版权

技术分享专栏收录该内容

6 篇文章 0 订阅

订阅专栏

sass使用

在vscode中安装插件，Live Sass Compiler，安装完毕后右键，扩展设置，然后点击在setting.json设置

在这里插入图片描述

在代码的最后插入这几行代码，直接复制然后保存就行

在这里插入图片描述

相关代码

"liveSassCompile.settings.formats": [
    {
      "format": "expanded",
      "extensionName": ".css",
      "savePath": "~/../css"
    },
  ],
  "liveSassCompile.settings.excludeList": [
    "**/node_modules/**",
    ".vscode/**"
  ],
  "liveSassCompile.settings.generateMap": false,
  "liveSassCompile.settings.autoprefix": [
    "> 1%",
    "last 3 versions"
  ],

新建一个文件夹命名为css（当然其他的也行，可以看看区别），然后新建.sass文件，并编写相关代码进行保存
在vscode编辑器中启动live sass compiler ,会自动生成对应的.css 文件。快捷键ctrl+shift+p 找到live sass compiler ,点击运行即可。这样就完成了一个基本的小demo了