在Visual Studio 2017中开发（.sass）

Question

我刚刚开始使用VS 2017而且我经常写.sass但是结果是VS只识别.scss文件有没有办法使VS识别.sass文件？

Answer 1

Visual Studio 2017提供（免费）扩展程序

其中一个是Web Compiler：https://marketplace.visualstudio.com/items?itemName=MadsKristensen.WebCompiler

您可以在Visual Studio IDE中安装它

获取扩展程序的Visual Studio菜单选项：

<强> 安装：

更新1：支持编译“.sass”扩展程序

Web编译器不支持旧的“.sass”格式。 要编译“.sass”，您必须使用 gulp-sass

以下是如何设置的步骤：

1. 启用npm（add package.json）



1. 添加gulp文件



1. 修改package.json以安装gulp-sass

{
  "version": "1.0.0",
  "name": "asp.net",
  "private": true,
  "devDependencies": {
    "gulp": "^3.9.1",
    "gulp-concat": "^2.6.1",
    "gulp-cssmin": "^0.1.7",
    "gulp-uglify": "^2.1.2",
    "rimraf": "^2.6.1",
    "gulp-sass": "^3.1.0"
  }
}

1. 添加SASS任务

var sass = require("gulp-sass");
var paths = {
    webroot: "./wwwroot/" /*Set this to your path accordingly*/
}
paths.scss = paths.webroot + "css/**/*.sass"; /*watches sub folders inside wwwroot/css/ */
gulp.task('sass', function () {
    gulp.src(paths.scss)
        .pipe(sass())
        .pipe(gulp.dest(paths.webroot + "css"));
});
gulp.task('watch-sass', function () {
    gulp.watch(paths.scss, ['sass']);
})

1. 设置sass-task并运行它



1. 在监视文件夹
中添加.sass文件



1. 每当您修改.sass文件时，都会创建.css文件