From fa5afe879eb346d68cc26a9d8111c402392e3103 Mon Sep 17 00:00:00 2001 From: Lukas Juhas Date: Tue, 21 Nov 2017 17:55:18 +0000 Subject: [PATCH] lint gulpfile, add eslint config and ignore file for those that using eslint --- .eslintignore | 2 + .eslintrc.js | 39 ++++++++++ gulpfile.babel.js | 189 +++++++++++++++++++++++----------------------- 3 files changed, 135 insertions(+), 95 deletions(-) create mode 100644 .eslintignore create mode 100644 .eslintrc.js diff --git a/.eslintignore b/.eslintignore new file mode 100644 index 0000000..927ee99 --- /dev/null +++ b/.eslintignore @@ -0,0 +1,2 @@ +js/**/*.js +node_modules/**/*.js diff --git a/.eslintrc.js b/.eslintrc.js new file mode 100644 index 0000000..bb764df --- /dev/null +++ b/.eslintrc.js @@ -0,0 +1,39 @@ +module.exports = { + "root": true, + "parserOptions": { + "parser": "babel-eslint", + "ecmaVersion": 2017, + "sourceType": "module" + }, + "env": { + "browser": true, + "node": true, + "es6": true + }, + "globals": { + "window": true, + "location": true + }, + "extends": [ + "airbnb-base", + ], + // custom rules here + "rules": { + // don"t require .vue extension when importing + "import/extensions": ["error", "always", { + "js": "never", + "vue": "js", + "mjs": "never" + }], + "no-param-reassign": ["error", { + "props": true, + "ignorePropertyModificationsFor": [ + "event", // for e.returnvalue + "response", // for Express responses + "item", // for item usually within each loops + ] + }], + // allow debugger during development + "no-debugger": process.env.NODE_ENV === "production" ? 2 : 0 + } +} diff --git a/gulpfile.babel.js b/gulpfile.babel.js index b0e3deb..d3ba008 100644 --- a/gulpfile.babel.js +++ b/gulpfile.babel.js @@ -1,4 +1,3 @@ -/* eslint-disable no-console */ import gulp from 'gulp'; import clean from 'gulp-clean'; import sass from 'gulp-sass'; @@ -20,7 +19,7 @@ import notify from 'gulp-notify'; import runSequence from 'run-sequence'; import path from 'path'; -const log = console.log; +const { log } = console; let production = false; let error = false; @@ -28,8 +27,8 @@ let error = false; * Config */ const config = { - src: './assets', - public: './', + src: './assets', + public: './', }; /** @@ -44,140 +43,140 @@ const tasks = ['styles', 'scripts', 'images']; * @param {string} status */ function notification(message = '', status = 'success') { - return gulp.src('./node_modules/gulp-notify/test/fixtures/1.txt') - .pipe(notify({ - title: 'Barebones', - message, - icon: path.join(__dirname, `assets/icons/${status}.png`), - })); + return gulp.src('./node_modules/gulp-notify/test/fixtures/1.txt') + .pipe(notify({ + title: 'Barebones', + message, + icon: path.join(__dirname, `assets/icons/${status}.png`), + })); } /** * Styles */ gulp.task('clean-styles', () => ( - gulp.src(`${config.public}/css`, { - read: false, - }) - .pipe(clean()) + gulp.src(`${config.public}/css`, { + read: false, + }) + .pipe(clean()) )); gulp.task('styles', ['clean-styles'], () => ( - gulp.src([`${config.src}/styles/*.scss`]) - .pipe(gulpif(!production, sourcemaps.init())) - .pipe(sass({ - outputStyle: production ? 'compressed' : 'nested', - }).on('error', (err) => { - notification('Failed to compile styles. 😱', 'error'); - log(err.stack); - error = true; - })) - .pipe(autoprefixer({ - browsers: ['last 10 versions'], - })) - .pipe(rename({ - suffix: '.min', - })) - .pipe(gulpif(!production, sourcemaps.write('.'))) - .pipe(gulp.dest(`${config.public}/css`)) + gulp.src([`${config.src}/styles/*.scss`]) + .pipe(gulpif(!production, sourcemaps.init())) + .pipe(sass({ + outputStyle: production ? 'compressed' : 'nested', + }).on('error', (err) => { + notification('Failed to compile styles. 😱', 'error'); + log(err.stack); + error = true; + })) + .pipe(autoprefixer({ + browsers: ['last 10 versions'], + })) + .pipe(rename({ + suffix: '.min', + })) + .pipe(gulpif(!production, sourcemaps.write('.'))) + .pipe(gulp.dest(`${config.public}/css`)) )); /** * Scripts */ gulp.task('clean-scripts', () => ( - gulp.src(`${config.public}/js`, { - read: false, - }) - .pipe(clean()) + gulp.src(`${config.public}/js`, { + read: false, + }) + .pipe(clean()) )); gulp.task('scripts', ['clean-scripts'], () => { - let env = 'development'; - if (production) { - env = 'production'; - } + let env = 'development'; + if (production) { + env = 'production'; + } - rollup({ - entry: `${config.src}/scripts/scripts.js`, - plugins: [ - multiEntry(), - buble(), - nodeResolve({ - browser: true, - main: true, - jsnext: true, - }), - commonjs({ - include: [ - 'node_modules/**', - `${config.src}/**`, - ], - }), - json(), - replace({ - 'process.env.NODE_ENV': JSON.stringify(env), - }), - production ? uglify({}, minify) : '', + rollup({ + entry: `${config.src}/scripts/scripts.js`, + plugins: [ + multiEntry(), + buble(), + nodeResolve({ + browser: true, + main: true, + jsnext: true, + }), + commonjs({ + include: [ + 'node_modules/**', + `${config.src}/**`, ], - }).then((bundle) => { - bundle.write({ - format: 'iife', - moduleName: 'BarebonesBundle', - sourceMap: !production, - dest: `${config.public}/js/script.min.js`, - }); - }).catch(err => { - notification('Failed to compile scripts. 😱', 'error'); - log(err.stack); - error = true; + }), + json(), + replace({ + 'process.env.NODE_ENV': JSON.stringify(env), + }), + production ? uglify({}, minify) : '', + ], + }).then((bundle) => { + bundle.write({ + format: 'iife', + moduleName: 'BarebonesBundle', + sourceMap: !production, + dest: `${config.public}/js/script.min.js`, }); + }).catch((err) => { + notification('Failed to compile scripts. 😱', 'error'); + log(err.stack); + error = true; + }); }); /** * Watch */ gulp.task('watch-files', tasks, () => { - gulp.watch(`${config.src}/styles/**/*.scss`, ['styles']); - gulp.watch(`${config.src}/scripts/**/*.js`, ['scripts']); - gulp.watch(`${config.src}/images/**/*.*`, ['images']); + gulp.watch(`${config.src}/styles/**/*.scss`, ['styles']); + gulp.watch(`${config.src}/scripts/**/*.js`, ['scripts']); + gulp.watch(`${config.src}/images/**/*.*`, ['images']); }); /** * Images */ gulp.task('images', () => { - // hadle all images that are not svg - gulp.src(`${config.src}/images/**/*.*`) - .pipe(imagemin({ - progressive: true, - svgoPlugins: [{ - removeViewBox: false, - }], - })) - .pipe(gulp.dest(`${config.public}/img`)); + // hadle all images that are not svg + gulp.src(`${config.src}/images/**/*.*`) + .pipe(imagemin({ + progressive: true, + svgoPlugins: [{ + removeViewBox: false, + }], + })) + .pipe(gulp.dest(`${config.public}/img`)); }); /** * Main Tasks */ gulp.task('watch', () => ( - runSequence(tasks, 'watch-files', () => { - if (!error) { - notification('Watching files... 👀'); - } - }) + runSequence(tasks, 'watch-files', () => { + if (!error) { + notification('Watching files... 👀'); + } + }) )); gulp.task('build', () => { - production = true; - runSequence(tasks, () => { - if(!error) { - notification('Build complete! 🍻'); - } - }); + production = true; + runSequence(tasks, () => { + if (!error) { + notification('Build complete! 🍻'); + } + }); }); gulp.task('default', () => ( - runSequence(tasks) + runSequence(tasks) ));