MVC Core中的Sass

我是MVC Core的新手。在MVC 5中，我只是將NuGet BundleTransformer.SassAndScss，並創建一個SCSS文件，這將工作。MVC Core中的Sass

現在，看到教程，每個人都假設我有gulpfile.js，package.json，npm等。我一直相當庇護，在一個webform C＃公司，剛剛被轉換爲MVC5，並被告知轉移到核心。

When I create a Core project，我可以像往常一樣創建SCSS文件，但不能編譯它們。現在，我很想擁有nuget包並忘記它，但是迄今爲止我沒有安裝任何包。所以我正在探索NPM，但沒有節點，因爲我的理解是Node是一種完全不同的語言，我安裝在計算機上，我不確定當我推入git時，同事是否會擁有它，等

我花了一天看不同的教程，但似乎沒有人開始從我的同一個地方。

這是最正式的教程（他們假設我有一個gulpfile.js，我不這樣做，而且當我創建一個教程時該教程不起作用）。 https://docs.asp.net/en/latest/client-side/less-sass-fa.html#id3

那麼，沒有人有一個非常基本的教程或示例項目，從一個非常.NET的背景開始？

謝謝！

來源

2016-11-03 user3919071

所以我解決了我的錯誤。以下是在Visual Studio中從MVC Core模板運行SCSS文件的所有步驟。

在src文件夾下，右鍵單擊項目名稱並添加一個名爲「package.json」的文件。
在「的package.json」粘貼此：

{ 
    "version": "1.0.0", 
    "name": "asp.net", 
    "private": true, 
    "devDependencies": { 
    "gulp": "3.9.1", 
    "gulp-sass": "2.3.2", 
    "rimraf": "2.5.4" 
    } 
}

同樣，在項目的根中，添加所謂的「Gulpfile.js」文件。

在它將此代碼粘貼：

var gulp = require("gulp"), 
rimraf = require("rimraf"), 
fs = require("fs"), 
sass = require("gulp-sass"); 

gulp.task("sass", function() { 
return gulp.src('wwwroot/css/site.scss') 
    .pipe(sass()) 
    .pipe(gulp.dest('wwwroot/css')); 
});

現在轉到在wwwroot文件夾，css文件夾，and add a SCSS file called "site.scss" (name does not matter)。但是，如果您將其命名爲site.scss，請確保您刪除默認site.css，以確保您的工作。

在你的scss文件中，放一些scss代碼。例如：

$base: #000000; 
body { 
    background-color: $base; 
}

如果你只要運行它，它會工作，但我必須承認，我仍然在查看 - >其他窗口去 - >任務運行資源管理器，我看到了任務sass，右鍵單擊它，運行，它工作，然後我跑了整個項目。請記住，_Layout和bundleconfig.json中已經有對site.css文件的引用，所以如果您爲scss文件選擇了另一個名稱或路徑，請相應地更改它....嗯，更改scss和re - 運行它不會改變前端。我需要去任務亞軍探險家和重新運行它每次...必須有一種方法來運行保存gulpfile任務...

好吧，我不得不在gulpfile.js中添加一個Watch任務並運行它在Task Runner Explorer中運行。

gulp.task('watch', function() { 
    gulp.watch('wwwroot/css/site.scss', ['sass']); 
});

來源

2016-11-04 15:52:59 user3919071

我在gulpfile增加了觀看的任務，以確保它每次我救了SCSS gulp.task（ '手錶'，函數（）{ gulp.watch（時間更新CSS「的wwwroot/CSS /site.scss'，['sass']）; }）; – user3919071

MVC Core中的Sass

回答

相關問題