Sass命令编译

作者: 砚婉儿 | 来源:发表于2017-04-12 11:31 被阅读0次

单文件编译:

sass <要编译的Sass文件路径>/style.scss:<要输出CSS文件路径>/style.css

这是对一个单文件进行编译,如果想对整个项目所有 Sass 文件编译成 CSS 文件,可以这样操作:

多文件编译:

sass sass/:css/

上面的命令表示将项目中“sass”文件夹中所有“.scss”(“.sass”)文件编译成“.css”文件,并且将这些 CSS 文件都放在项目中“css”文件夹中。

缺点及解决方法:

在实际编译过程中,你会发现上面的命令,只能一次性编译。每次个性保存“.scss”文件之后,都得重新执行一次这样的命令。如此操作太麻烦,其实还有一种方法,就是在编译 Sass 时,开启“watch”功能,这样只要你的代码进行任保修改,都能自动监测到代码的变化,并且给你直接编译出来:

sass --watch <要编译的Sass文件路径>/style.scss:<要输出CSS文件路径>/style.css

watch 举例:

来看一个简单的示例,假设我本地有一个项目,我要把项目中“bootstrap.scss”编译出“bootstrap.css”文件,并且将编译出来的文件放在“css”文件夹中,我就可以在我的命令终端中执行:

sass --watch sass/bootstrap.scss:css/bootstrap.css

一旦我的 bootstrap.scss 文件有任何修改,只要我重新保存了修改的文件,命令终端就能监测,并重新编译出文件:

…………END…………

谢谢支持,喜欢就点个❤

相关文章

  • Sass编译

    一、命令编译 命令编译是指使用你电脑中的命令终端,通过输入 Sass 指令来编译 Sass。 多文件编译文件结构如...

  • sass AND compass

    SASS 配置环境sass是基于Ruby;安装Ruby,在命令行输入以下命令gem install sass 编译...

  • 入门Sass——编译

    命令行编译 //单文件转换命令sass input.scss output.css //单文件监听命令sass -...

  • sass笔记-入门

    sass与scss的区别 sass严格按缩进式,不带打括号和分号,scss与css类似 编译 命令编译单个文件编译...

  • Sass命令编译

    单文件编译: 这是对一个单文件进行编译,如果想对整个项目所有 Sass 文件编译成 CSS 文件,可以这样操作: ...

  • gulp-ruby-sass与gulp-sass

    gulp-ruby-sass 它使用Sass gem编译Sass,将结果输出到一个gulp流 安装命令npm in...

  • sass文件命令行编译

    有时候确实需要命令行手工编译,以下命令备忘 sass xx.sass xx.css --style expande...

  • SASS用法

    编译 sass的编译命令:sass input.css output.css真正使用场景下可以对整个文件夹进行监听...

  • sass使用

    sass编译和介绍 安装vscode插件Live Sass Compiler编译sass 开启watch sass...

  • 安装-编译

    安装 安装node-sass来编译sass文件 安装ruby来编译sass文件 编译 node-sass 使用we...

网友评论

    本文标题:Sass命令编译

    本文链接:https://www.haomeiwen.com/subject/jgtmattx.html