Skip to content

Instantly share code, notes, and snippets.

@kicumkicum
Created February 25, 2019 12:09
Show Gist options
  • Select an option

  • Save kicumkicum/03c46ba508178371af4734ad8c1ea8ac to your computer and use it in GitHub Desktop.

Select an option

Save kicumkicum/03c46ba508178371af4734ad8c1ea8ac to your computer and use it in GitHub Desktop.
const autoprefixer = require(`autoprefixer`);
const del = require(`del`);
const commonjs = require(`rollup-plugin-commonjs`);
const gulp = require(`gulp`);
const imagemin = require(`gulp-imagemin`);
const plumber = require(`gulp-plumber`);
const postcss = require(`gulp-postcss`);
const minify = require(`gulp-csso`);
const mocha = require(`gulp-mocha`);
const mqpacker = require(`css-mqpacker`);
const rename = require(`gulp-rename`);
const rollup = require(`gulp-better-rollup`);
const sass = require(`gulp-sass`);
const server = require(`browser-sync`).create();
const sourcemaps = require(`gulp-sourcemaps`);
const svgstore = require(`gulp-svgstore`);
gulp.task(`style`, () => {
return gulp.src(`sass/style.scss`)
.pipe(plumber())
.pipe(sass())
.pipe(postcss([
autoprefixer({
browsers: [
`last 1 version`,
`last 2 Chrome versions`,
`last 2 Firefox versions`,
`last 2 Opera versions`,
`last 2 Edge versions`
]
}),
mqpacker({sort: true})
]))
.pipe(gulp.dest(`build/css`))
.pipe(server.stream())
.pipe(minify())
.pipe(rename(`style.min.css`))
.pipe(gulp.dest(`build/css`));
});
gulp.task(`sprite`, () => {
return gulp.src(`img/sprite/*.svg`)
.pipe(svgstore({
inlineSvg: true
}))
.pipe(rename(`sprite.svg`))
.pipe(gulp.dest(`build/img`));
});
gulp.task(`scripts`, () => {
return gulp.src(`js/**/*.js`)
.pipe(plumber())
.pipe(gulp.dest(`build/js/`));
});
gulp.task(`imagemin`, [`copy`], () => {
return gulp.src(`build/img/**/*.{jpg,png,gif}`)
.pipe(imagemin([
imagemin.optipng({optimizationLevel: 3}),
imagemin.jpegtran({progressive: true})
]))
.pipe(gulp.dest(`build/img`));
});
gulp.task(`copy-html`, () => {
return gulp.src(`*.{html,ico}`)
.pipe(gulp.dest(`build`))
.pipe(server.stream());
});
gulp.task(`copy`, [`copy-html`, `scripts`, `style`, `sprite`], () => {
return gulp.src([
`fonts/**/*.{woff,woff2}`,
`img/*.*`
], {base: `.`})
.pipe(gulp.dest(`build`));
});
gulp.task(`clean`, () => {
return del(`build`);
});
gulp.task(`js-watch`, [`scripts`], (done) => {
server.reload();
done();
});
gulp.task(`serve`, [`assemble`], () => {
server.init({
server: `./build`,
notify: false,
open: true,
port: 3502,
ui: false
});
gulp.watch(`sass/**/*.{scss,sass}`, [`style`]);
gulp.watch(`*.html`).on(`change`, (e) => {
if (e.type !== `deleted`) {
gulp.start(`copy-html`);
}
});
gulp.watch(`js/**/*.js`, [`js-watch`]);
});
gulp.task(`assemble`, [`clean`], () => {
gulp.start(`copy`, `style`);
});
gulp.task(`build`, [`assemble`], () => {
gulp.start(`imagemin`);
});
gulp.task(`test`, function () {
return gulp
.src([`js/**/*.test.js`])
.pipe(rollup({
plugins: [
commonjs()
]}, `cjs`))
.pipe(gulp.dest(`build/test`))
.pipe(mocha({
reporter: `spec`
}));
});
gulp.task(`scripts`, () => {
return gulp.src(`js/main.js`)
.pipe(plumber())
.pipe(sourcemaps.init())
.pipe(rollup({}, `iife`))
.pipe(sourcemaps.write(``))
.pipe(gulp.dest(`build/js`));
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment