AniwatchPlus/gulpfile.js

335 lines
9.9 KiB
JavaScript
Raw Normal View History

2020-08-26 17:57:10 +02:00
const gulp = require('gulp');
const cssnano = require('cssnano')
const gulpLoadPlugins = require('gulp-load-plugins')
const terser = require('terser');
2020-08-26 17:57:10 +02:00
const del = require('del');
2020-08-26 20:32:34 +02:00
const browserify = require('browserify');
2020-12-28 21:46:45 +01:00
const tsify = require('tsify')
2020-08-26 20:32:34 +02:00
const babelify = require('babelify');
const source = require('vinyl-source-stream');
const buffer = require('vinyl-buffer');
const merge = require('merge-stream');
const fs = require('fs');
const factor = require('factor-bundle');
const { debug } = require('console');
2020-08-26 17:57:10 +02:00
const $ = gulpLoadPlugins()
$.sass.compiler = require('sass');
/* ============================================================================
Base consts
============================================================================ */
// Project sources
const src = {
root: 'src',
2020-08-26 18:09:10 +02:00
manifests: 'src/manifests',
2020-08-26 17:57:10 +02:00
styles: 'src/stylesheets',
scripts: 'src/javascript',
images: 'src/images',
2020-11-02 18:38:51 +01:00
html: 'src/html',
2020-08-26 17:57:10 +02:00
}
// Build path
const tmp = {
root: '.tmp',
2020-08-26 18:09:10 +02:00
manifests: '.tmp/manifests',
2020-08-26 17:57:10 +02:00
styles: '.tmp/stylesheets',
scripts: '.tmp/javascript',
images: '.tmp/images',
2020-11-02 18:38:51 +01:00
html: '.tmp/html',
2020-08-26 17:57:10 +02:00
}
// Dist path
const dist = {
root: 'dist',
chrome: {
root: 'dist/chrome',
styles: 'dist/chrome/stylesheets',
scripts: 'dist/chrome/javascript',
images: 'dist/chrome/images',
2020-11-02 18:38:51 +01:00
html: 'dist/chrome/html',
},
firefox: {
root: 'dist/firefox',
styles: 'dist/firefox/stylesheets',
scripts: 'dist/firefox/javascript',
images: 'dist/firefox/images',
2020-11-02 18:38:51 +01:00
html: 'dist/firefox/html',
},
opera: {
root: 'dist/opera',
styles: 'dist/opera/stylesheets',
scripts: 'dist/opera/javascript',
images: 'dist/opera/images',
2020-11-02 18:38:51 +01:00
html: 'dist/opera/html',
},
zip: 'dist/zips',
2020-08-26 17:57:10 +02:00
}
// Build mode
const isProd = process.env.NODE_ENV === 'production';
const isDev = !isProd;
/* ============================================================================
Build tasks
============================================================================ */
gulp.task('styles', () => {
return gulp.src(`${src.styles}/*.scss`)
.pipe($.plumber())
// sourcemap initialization
.pipe($.if(isDev, $.sourcemaps.init()))
// sass compilation
.pipe($.sass.sync({
outputStyle: 'expanded',
precision: 7,
includePaths: ['.'],
}).on('error', $.sass.logError))
// autoprefix
.pipe($.autoprefixer())
// out stream size
.pipe($.size({
showFiles: true
}))
.pipe(gulp.dest(tmp.styles))
.pipe($.rename({ suffix: '.min' }))
// minimize and optimize
.pipe($.if('*.css', $.postcss([
cssnano({
safe: true,
autoprefixer: false,
zindex: false,
reduceIdents: {
keyframes: true,
},
})
])))
// out stream size
.pipe($.size({
showFiles: true
}))
// write sourcemaps
2020-08-26 20:32:34 +02:00
.pipe($.if(isDev, $.sourcemaps.write()))
2020-08-26 17:57:10 +02:00
.pipe(gulp.dest(tmp.styles))
})
gulp.task('scripts', () => {
const modules = [
'app',
'settings',
];
const inputs = [];
const streams = [];
modules.forEach(module => {
2020-12-28 21:46:45 +01:00
inputs.push(`${src.scripts}/${module}.ts`);
streams.push(source(`${module}.js`));
});
const b = browserify(inputs, { debug: isDev });
let outstream = b
2020-12-28 21:46:45 +01:00
.plugin(tsify)
.transform('babelify')
.plugin(factor, { outputs: streams })
.bundle()
.pipe(source('common.js'))
streams.forEach(stream => {
outstream = outstream.pipe($.merge(stream));
2020-08-26 20:32:34 +02:00
});
return outstream
2020-08-26 17:57:10 +02:00
.pipe($.plumber())
2020-08-26 20:32:34 +02:00
.pipe(buffer())
.pipe($.if(isDev, $.sourcemaps.init({ loadMaps: true })))
.pipe($.terser({ compress: { drop_console: isProd, drop_debugger: isProd } }))
2020-08-26 17:57:10 +02:00
.pipe($.rename({ suffix: '.min' }))
.pipe($.size({
showFiles: true,
}))
2020-08-26 20:32:34 +02:00
.pipe($.if(isDev, $.sourcemaps.write()))
.pipe(gulp.dest(`${tmp.scripts}`));
2020-08-26 17:57:10 +02:00
})
gulp.task('images', () => {
return gulp.src(`${src.images}/**/*`)
.pipe($.plumber())
.pipe($.imagemin([
$.imagemin.gifsicle({ interlaced: true }),
$.imagemin.mozjpeg({ progressive: true }),
$.imagemin.optipng(),
$.imagemin.svgo({ plugins: [{ cleanupIDs: false }] })
]))
2020-08-26 18:09:10 +02:00
.pipe($.size({
showFiles: true,
}))
2020-08-26 17:57:10 +02:00
.pipe(gulp.dest(tmp.images))
})
2020-11-02 18:42:50 +01:00
gulp.task('html', () => {
return gulp.src(`${src.html}/**/*`)
.pipe($.plumber())
// any steps for HTML processing?
.pipe($.size({
showFiles: true,
}))
.pipe(gulp.dest(tmp.html))
})
2020-08-26 18:09:10 +02:00
gulp.task('manifests', () => {
const templateFile = `${src.manifests}/manifest.template.json`;
let template = JSON.parse(fs.readFileSync(templateFile))
return gulp.src(`${src.manifests}/**/!(*.template).json`)
2020-08-26 18:09:10 +02:00
.pipe($.plumber())
.pipe($.replace('$name', template.name))
.pipe($.replace('$shortName', template.short_name))
.pipe($.replace('$version', template.version))
.pipe($.replace('$semanticVersion', template.version_name))
.pipe($.replace('$description', template.description))
.pipe($.replace('$author', template.author))
2020-09-06 20:31:00 +02:00
.pipe($.replace('$developer', JSON.stringify(template.developer)))
.pipe($.replace('$homepageURL', template.homepage_url))
2020-08-26 18:09:10 +02:00
.pipe($.size({
showFiles: true,
}))
.pipe(gulp.dest(tmp.manifests))
})
2020-08-29 16:44:41 +02:00
/* ============================================================================
Watchers
============================================================================ */
gulp.task('watch', (done) => {
gulp.watch(`${src.styles}/**/*.scss`, gulp.series('clean:build', 'styles', 'dist:copy', 'dist:zip'))
2020-12-29 15:42:06 +01:00
gulp.watch(`${src.scripts}/**/*.ts`, gulp.series('clean:build', 'scripts', 'dist:copy', 'dist:zip'))
2020-08-29 16:44:41 +02:00
gulp.watch(`${src.images}/**/*`, gulp.series('clean:build', 'images', 'dist:copy', 'dist:zip'))
2020-11-02 18:42:50 +01:00
gulp.watch(`${src.html}/**/*`, gulp.series('clean:build', 'html', 'dist:copy', 'dist:zip'))
2020-08-29 16:44:41 +02:00
gulp.watch(`${src.manifests}/**/*.*`, gulp.series('clean:build', 'manifests', 'dist:copy', 'dist:zip'))
done();
})
2020-08-26 17:57:10 +02:00
/* ============================================================================
Clean
============================================================================ */
gulp.task('clean:build', del.bind(null, [tmp.root]))
gulp.task('clean:dist', del.bind(null, [dist.root], { force: true })) // Das Force brauchen wir, da das Assets Verzeichnis außerhalb des Working Directories ist.
gulp.task('clean', gulp.series('clean:build', 'clean:dist'))
/* ============================================================================
BUILD CLEAN ALL
============================================================================ */
2020-11-02 18:42:50 +01:00
gulp.task('build', gulp.series('manifests', 'images', 'scripts', 'styles', 'html'));
2020-08-29 16:44:41 +02:00
gulp.task('build:clean', gulp.series('clean:build', 'manifests', 'images', 'scripts', 'styles'));
2020-08-26 17:57:10 +02:00
/* ============================================================================
DIST CLEAN ALL
============================================================================ */
gulp.task('dist:chrome', (done) => {
return merge(
// copy images
gulp.src(`${tmp.images}/**/*`)
.pipe(gulp.dest(dist.chrome.images)),
2020-08-26 17:57:10 +02:00
// copy scripts
gulp.src(`${tmp.scripts}/**/*.{min.js,min.js.gz}`)
.pipe(gulp.dest(dist.chrome.scripts)),
2020-08-26 17:57:10 +02:00
// copy styles
gulp.src(`${tmp.styles}/*.{min.css,min.css.gz}`)
.pipe(gulp.dest(dist.chrome.styles)),
2020-08-26 17:57:10 +02:00
2020-11-02 18:42:50 +01:00
// copy html
gulp.src(`${tmp.html}/*.html`)
.pipe(gulp.dest(dist.chrome.html)),
gulp.src(`${tmp.manifests}/chrome*`)
.pipe($.rename('manifest.json'))
.pipe(gulp.dest(dist.chrome.root))
);
})
gulp.task('dist:firefox', (done) => {
return merge(
// copy images
gulp.src(`${tmp.images}/**/*`)
.pipe(gulp.dest(dist.firefox.images)),
// copy scripts
gulp.src(`${tmp.scripts}/**/*.{min.js,min.js.gz}`)
.pipe(gulp.dest(dist.firefox.scripts)),
// copy styles
gulp.src(`${tmp.styles}/*.{min.css,min.css.gz}`)
.pipe(gulp.dest(dist.firefox.styles)),
2020-11-02 18:42:50 +01:00
// copy html
gulp.src(`${tmp.html}/*.html`)
.pipe(gulp.dest(dist.firefox.html)),
gulp.src(`${tmp.manifests}/firefox*`)
.pipe($.rename('manifest.json'))
.pipe(gulp.dest(dist.firefox.root))
);
})
gulp.task('dist:opera', (done) => {
return merge(
// copy images
gulp.src(`${tmp.images}/**/*`)
.pipe(gulp.dest(dist.opera.images)),
// copy scripts
gulp.src(`${tmp.scripts}/**/*.{min.js,min.js.gz}`)
.pipe(gulp.dest(dist.opera.scripts)),
// copy styles
gulp.src(`${tmp.styles}/*.{min.css,min.css.gz}`)
.pipe(gulp.dest(dist.opera.styles)),
2020-11-02 18:42:50 +01:00
// copy html
gulp.src(`${tmp.html}/*.html`)
.pipe(gulp.dest(dist.opera.html)),
gulp.src(`${tmp.manifests}/opera*`)
.pipe($.rename('manifest.json'))
.pipe(gulp.dest(dist.opera.root))
);
})
gulp.task('dist:copy', gulp.series('dist:chrome', 'dist:firefox', 'dist:opera'));
gulp.task('dist:zip', (done) => {
gulp.src(`${dist.chrome.root}/**/*`)
.pipe($.zip('chrome.zip'))
.pipe(gulp.dest(dist.root));
gulp.src(`${dist.firefox.root}/**/*`)
.pipe($.zip('firefox.zip'))
.pipe(gulp.dest(dist.root));
gulp.src(`${dist.opera.root}/**/*`)
.pipe($.zip('opera.zip'))
.pipe(gulp.dest(dist.root));
2020-08-26 17:57:10 +02:00
done();
})
2020-09-06 20:16:01 +02:00
gulp.task('dist', gulp.series('clean', 'build', 'dist:copy', 'dist:zip'));