const { watch, series, parallel } = require('gulp'); const gulp = require('gulp'); /** JS and TS */ const ts = require('gulp-typescript'); const apiExtractor = require('@microsoft/api-extractor'); const tsDefaultReporter = ts.reporter.defaultReporter(); const babel = require('gulp-babel'); const sourcemaps = require('gulp-sourcemaps'); /** css modules */ const gulp_tcm = require('gulp-typed-css-modules'); const autoprefixer = require('autoprefixer') const postcss = require('gulp-postcss') const compileSass = require('gulp-sass')(require('sass')); const cleanCSS = require('gulp-clean-css'); /** file */ const concat = require('gulp-concat'); const rimraf = require('rimraf'); const through2 = require("through2"); const merge2 = require('merge2'); const path = require('path'); const compileLess = require('./buildTools/transformLess'); const babelConfig = require('./babel.config.js'); const cwd = process.cwd(); const dir = path.join(cwd, './lib/'); /** functions */ function typedCss() { return gulp.src([`${dir}/**/*.css`], { base: '.', }) .pipe(gulp_tcm({ quiet: true })) .pipe(gulp.dest("./")); } function autoprefixCss() { return gulp.src([`${dir}/**/*.css`], { base: '.', }) .pipe(postcss([autoprefixer()])) .pipe(gulp.dest('./')) } // Sass must come before Less function combineComponentsCss() { return gulp.src([`${dir}/styles/ComponentsSass.css`, `${dir}/styles/ComponentsLess.css`]) .pipe(concat('Components.css')) .pipe(cleanCSS()) .pipe(gulp.dest(`${dir}/styles/`)); } // Sass must come before Less function combineBaseCss() { return gulp.src([`${dir}/styles/BaseSass.css`, `${dir}/styles/BaseLess.css`]) .pipe(concat('Base.css')) .pipe(cleanCSS()) .pipe(gulp.dest(`${dir}/styles/`)); } function compile() { rimraf.sync(dir); const less = gulp .src(['src/**/*.less']) .pipe( through2.obj(function (file, encoding, next) { this.push(file.clone()); compileLess(file.path) .then(css => { file.contents = Buffer.from(css); file.path = file.path.replace(/\.less$/, '.css'); this.push(file); next(); }) .catch(e => { console.error(e); }); }) ) .pipe(gulp.dest(dir)); const assets = gulp .src(['src/**/*.@(png|svg)']) .pipe(gulp.dest(dir)); const sass = gulp .src(['src/**/*.scss']) .pipe(compileSass({ includePaths: ['./node_modules'], quietDeps: true }).on('error', compileSass.logError)) .pipe(gulp.dest(dir)); const error = 0; const source = ['src/**/*.tsx', 'src/**/*.ts', '!src/**/*.test.*']; const tsProject = ts.createProject('tsconfig.json') const tsResult = gulp.src(source).pipe( tsProject() ); function check() { if (error && !argv['ignore-error']) { process.exit(1); } } tsResult.on('finish', check); tsResult.on('end', check); const tsFilesStream = babelify(tsResult.js); const tsd = tsResult.dts.pipe(gulp.dest(dir)); return merge2([less, tsFilesStream, tsd, assets, sass]); } function babelify(js) { delete babelConfig.cacheDirectory; const stream = js .pipe(sourcemaps.init()) .pipe(babel(babelConfig)) .pipe(sourcemaps.write('.')); return stream.pipe(gulp.dest(dir)); } function tsDocGen(cb) { const apiExtractorJsonPath = path.join(cwd, 'api-extractor.json'); // Load and parse the api-extractor.json file const extractorConfig = apiExtractor.ExtractorConfig.loadFileAndPrepare(apiExtractorJsonPath); // Invoke API Extractor const extractorResult = apiExtractor.Extractor.invoke(extractorConfig, { // Equivalent to the "--local" command-line parameter localBuild: true, // Equivalent to the "--verbose" command-line parameter showVerboseMessages: true }); if (extractorResult.succeeded) { console.error(`API Extractor completed successfully`); } else { console.error(`API Extractor completed with ${extractorResult.errorCount} errors` + ` and ${extractorResult.warningCount} warnings`); } cb(); } function buildAndWatch(cb) { watch(['src/**/*.tsx', 'src/**/*.ts', 'src/**/*.scss', 'src/**/*.less'], { ignoreInitial: false }, series(compile, autoprefixCss, typedCss, parallel(combineComponentsCss, combineBaseCss, tsDocGen))); cb(); } module.exports.default = series(compile, autoprefixCss, typedCss, combineComponentsCss, combineBaseCss, tsDocGen); module.exports.watch = buildAndWatch; module.exports.tsDocGen = tsDocGen;