sassの導入

さらに、sassが利用できるように、gulpfileで設定を行います。

const gulp = require('gulp');
const sass = require('gulp-sass');

gulp.task('sass', function(){
  gulp.src('./src/scss/*.scss')
    .pipe(sass())
    .pipe(gulp.dest('./dest/css'));
});

gulp.task('default', function(){
  gulp.watch('./src/scss/*.scss', ['sass']);
})

こちらでgulpfileの設定ができました。

yarn run gulp

でgulpを走らせ、テーマファイル内にsrcフォルダ、srcフォルダ内にscssフォルダを作成し、その中にscssのファイルを作成して見ましょう。自動的にdest/cssフォルダ内にcssファイルが出来上がっていれば完成です。