东京铁塔
结合VS code的 task runner 可以将.scss文件编译成.css文件。
第一步:安装Sass transpiler######
# sudo install -g node-sass```
######第二步:创建Sass文件######
styles.scss文件 :
$padding: 6px;
nav {
ul {
margin: 0;
padding: $padding;
list-style: none;
}
...
}```
第三步:创建tasks.json######
通过 ⇧⌘P 打开命令面板,键入Configure Task Runner
点击 Enter,在选择对话框中选择 Others 选项。这会创建一个带有 tasks.json 文件的 .vscode 文件夹。文件的内容是一个执行任意命令的示例。我们需要简单的修改文件内容:
# 修改前
"version": "0.1.0",
"command": "echo",
"isShellCommand": true,
"args": ["Hello World"],
"showOutput": "always"```
修改后
{
"version": "0.1.0",
"command": "node-sass",
"isShellCommand": true,
"args": ["styles.scss", "styles.css"]
}```
tasks.json
第四步:运行Build任务######
点击 ⇧⌘B 会执行 node-sass styles.scss styles.css
命令,将 style.scss 编译到 style.css。
scss to css