const beautify = require('gulp-cssbeautify') const gulp = require('gulp') const eslint = require('gulp-eslint') const fs = require('fs') const stylelint = require('gulp-stylelint') const sass = require('gulp-sass') gulp.task('lint:js', () => { return gulp.src(['**/*.js','!node_modules/**']) .pipe(eslint()) .pipe(eslint.format()) }) gulp.task('lint:sass', () => { const options = { reporters: [{formatter: 'string', console: true}] } return gulp.src('sass/**/*.s*') .pipe(stylelint(options)) }) gulp.task('build:dev', () => { const options = { outputStyle: 'compressed' } const bOptions = { indent: ' ', autosemicolon: true } return gulp.src('sass/**/*.s*') .pipe(sass(options).on('error', sass.logError)) .pipe(beautify(bOptions)) .pipe(gulp.dest('temp')) }) gulp.task('build:prod', () => { const options = { outputStyle: 'compressed' } const bOptions = { indent: ' ', autosemicolon: true } return gulp.src('sass/**/*.s*') .pipe(sass(options).on('error', sass.logError)) .pipe(beautify(bOptions)) .pipe(gulp.dest('css')) }) gulp.task('generate', ['lint:js', 'lint:sass', 'build:dev', 'build:prod'], () => { // Generates all *.user.css styles. const { bump } = require('./bump.js') const klawSync = require('klaw-sync') const path = require('path') const userCss = require('usercss-creator') // Define constants const stylesDirectory = path.join(__dirname, 'sass') const cssDirectory = path.join(__dirname, 'temp') // Walk recursively through styles directory let files = klawSync(stylesDirectory, {nodir: true}) // Filter out any files that aren't .json files files = files.filter(file => path.extname(file.path) === '.json') let style let incrementType for (const arg of process.argv) { if (arg.includes('--bump')) { style = arg.substring('--bump='.length, arg.length) } switch (arg) { case '--major': incrementType = 'major' break case '--minor': incrementType = 'minor' break case '--patch': incrementType = 'patch' break } } // Iterate through all .json files for (const file of files) { // Requiring the .json file as the descriptor of the style const descriptor = require(file.path) // If --bump=all then bump every style if (style === 'all') { bump(file.path, incrementType) } // Test if the style we want to bump is the one currently generating else if (style === descriptor.folder) { // Bump the style's .json with the increment type bump(file.path, incrementType) } // Create the css path and generate the .user.css file with the options const cssPath = path.join(cssDirectory, descriptor.folder, descriptor.entry) const outPath = path.join(__dirname, 'css', descriptor.folder) let styleFile = `@-moz-document domain('${descriptor.options.namespace}') {\n` styleFile += fs.readFileSync(cssPath, {encoding: 'UTF-8'}) styleFile += '}' fs.writeFileSync(cssPath, styleFile, {encoding: 'UTF-8'}) userCss.create(cssPath, descriptor.options, outPath) } }) gulp.task('watch', () => { gulp.watch('sass/**/*.s*', ['lint:js', 'lint:sass', 'build:dev']) })