gulp.js – sass to css
Step 1: Create MVC 6 Core Project
GulpExample
Step 2: Create a SASS Folder and File
wwwroot = > Create a new Folder (sass) = > create new sass file “style.scss” and create folder css.
$bgColor:#cccccc; body{ background-color:$bgColor; }
Step 3: Create Gulp Folder
Add NewFolder => Gulp
Step 4: Configure Your Project
Open cmd and move to working directory i.e Gulp Folder to generate package.json
configuration.
npm init
Step 5: Install Gulp Locally
npm install gulp --save-dev
npm install gulp-sass --save-dev
This command will create the node_modules folder consist of all the npm Library.
Step 6: Create a Gulp Configuration File
Create gulpfile.js
let gulp = require('gulp'); let sass = require("gulp-sass"); gulp.task('sass', function () { return gulp.src('../wwwroot/sass/*.scss') .pipe(sass().on('error', sass.logError)) .pipe(gulp.dest('../wwwroot/sass/css')); });
Step 7: Run the Task in cmd.
Open cmd and move to working directory i.e Gulp Folder
gulp sass;