gulp

安装gulp

npm i gulp gulp-cli -g

在当前themes下编译:

gulp sass
gulp build

文件目录(同级):

themes
├───css # css文件夹
├───js # js文件夹
├───images # images文件夹
├───fonts # fonts文件夹
├───gulpfile.js # gulp配置
├───fonts.list　　 # fonts导入列表
└───package.json

创建gulpfile.js文件(与package.json同级):

const {
  task,
  watch,
  series,
  src,
  dest
} = require('gulp');
var sass = require('gulp-sass')(require('sass'));
var sourcemaps = require('gulp-sourcemaps');
var autoprefixer = require('gulp-autoprefixer');
var googleWebFonts = require('gulp-google-webfonts');
var fs = require('fs');

function set_env(type) {
  env = type || 'dev';
  fs.writeFile("js/env.js", 'function ENV(){return"' + env + '"};', function (err) {
    err && console.log(err);
  });
}

// build
task('build', (done) => {
  set_env(process.env.NODE_ENV);
  return src('js/env.js')
    .on('end', done);
});

//gulp scss
task('scss', (done) => {
  return src([
    'scss/**/*.scss',
    '!./scss/import/**/*.scss',
  ])
    .pipe(sourcemaps.init())
    .pipe(sass())
    .pipe(autoprefixer())
    .pipe(sourcemaps.write('./'))
    .pipe(dest('css'))
    .on('end', done);
});

// gulp lib
task('lib', (done) => {
  return src([
    './node_modules/echarts/dist/echarts.min.js',
    './node_modules/select2/dist/js/*2.min.js',
    './node_modules/select2/dist/css/*2.min.css',
  ])
    .pipe(dest('js/lib'))
    .on('end', done)
});

//gulp fonts
var options = {};
task('fonts', function () {
  return src('./fonts.list')
    .pipe(googleWebFonts(options))
    .pipe(dest('fonts'))
    .on('end', done);
});

//gulp watch
task('watch', () => {
  watch(['scss/**/*.scss'], series('scss'));
});

//gulp scss:watch
task('scss:watch', (done) => {
  watch(['scss/**/*.scss'], series('scss')).on('end', done);
});

gulp font, 先创建fonts.list文件(与gulpfile.js同级)

//  Google Font
Open Sans:300,400,600,700