├── source ├── scripts │ ├── lib │ │ └── .gitkeep │ └── main.js ├── styles │ ├── layout │ │ └── _header.scss │ ├── _site-settings.scss │ ├── modules │ │ ├── _grid.scss │ │ └── _welcome.scss │ ├── _base.scss │ └── main.scss ├── html │ ├── partials │ │ └── sprites.ejs │ └── index.ejs └── images │ └── logo.svg ├── .babelrc ├── .travis.yml ├── test └── main-test.js ├── gulpfile.babel.js ├── tasks ├── clean.js ├── deploy.js ├── fonts.js ├── connect.js ├── build.js ├── default.js ├── images.js ├── markup.js ├── styles.js └── scripts.js ├── .editorconfig ├── .eslintrc ├── .gitignore ├── LICENSE ├── CONTRIBUTING.md ├── package.json ├── README.md └── config.js /source/scripts/lib/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ "es2015" ] 3 | } 4 | -------------------------------------------------------------------------------- /source/scripts/main.js: -------------------------------------------------------------------------------- 1 | console.log('Hello World!'); 2 | -------------------------------------------------------------------------------- /source/styles/layout/_header.scss: -------------------------------------------------------------------------------- 1 | .l-header { 2 | 3 | } 4 | -------------------------------------------------------------------------------- /.travis.yml: -------------------------------------------------------------------------------- 1 | language: node_js 2 | 3 | node_js: 4 | - node 5 | - 6 6 | - 4 7 | -------------------------------------------------------------------------------- /test/main-test.js: -------------------------------------------------------------------------------- 1 | import test from 'ava'; 2 | 3 | test('First hardcoded test', t => { 4 | t.deepEqual([1, 2], [1, 2]); 5 | }); 6 | -------------------------------------------------------------------------------- /source/styles/_site-settings.scss: -------------------------------------------------------------------------------- 1 | /* ==================== 2 | Site Settings 3 | ===================== */ 4 | 5 | $enable-flex: true; // Remove for legacy support 6 | -------------------------------------------------------------------------------- /gulpfile.babel.js: -------------------------------------------------------------------------------- 1 | // Kreativgebiet GmbH 2 | // 3 | // Require all gulp tasks from the subfolder 4 | // and let them call themselves 5 | 6 | require('require-dir')('./tasks', { recurse: true }); 7 | -------------------------------------------------------------------------------- /tasks/clean.js: -------------------------------------------------------------------------------- 1 | 2 | import gulp from 'gulp'; 3 | import rimraf from 'rimraf'; 4 | import { server } from '../config'; 5 | 6 | gulp.task('clean', (done) => { 7 | rimraf(server.dest, done); 8 | }); 9 | -------------------------------------------------------------------------------- /tasks/deploy.js: -------------------------------------------------------------------------------- 1 | 2 | import gulp from 'gulp'; 3 | import rsyncwrapper from 'rsyncwrapper'; 4 | import { rsync } from '../config'; 5 | 6 | gulp.task('deploy', (done) => { 7 | rsyncwrapper(rsync, done); 8 | }); 9 | -------------------------------------------------------------------------------- /.editorconfig: -------------------------------------------------------------------------------- 1 | root = true 2 | 3 | [*] 4 | end_of_line = lf 5 | insert_final_newline = true 6 | indent_style = space 7 | indent_size = 2 8 | 9 | [{package.json,.travis.yml}] 10 | indent_style = space 11 | indent_size = 2 12 | -------------------------------------------------------------------------------- /tasks/fonts.js: -------------------------------------------------------------------------------- 1 | 2 | import gulp from 'gulp'; 3 | import { join } from 'path'; 4 | import { watch, server } from '../config'; 5 | 6 | gulp.task('fonts', () => { 7 | gulp.src(watch.fonts).pipe(gulp.dest(join(server.dest, 'fonts'))); 8 | }); 9 | -------------------------------------------------------------------------------- /tasks/connect.js: -------------------------------------------------------------------------------- 1 | import gulp from 'gulp'; 2 | import { server } from '../config'; 3 | 4 | const browserSync = require('browser-sync').create(); 5 | 6 | gulp.task('server', () => { 7 | browserSync.init(server.browserSync); 8 | }); 9 | 10 | export default browserSync; 11 | -------------------------------------------------------------------------------- /tasks/build.js: -------------------------------------------------------------------------------- 1 | import gulp from 'gulp'; 2 | import sequence from 'run-sequence'; 3 | 4 | gulp.task('build', ['clean'], () => { 5 | sequence( 6 | 'images:build', 7 | 'styles:build', 8 | 'scripts:build', 9 | 'scripts:libs', 10 | 'fonts', 11 | 'markup', 12 | ); 13 | }); 14 | -------------------------------------------------------------------------------- /source/styles/modules/_grid.scss: -------------------------------------------------------------------------------- 1 | /* ==================== 2 | Module/Grid 3 | ===================== */ 4 | 5 | .grid { 6 | justify-content: center; 7 | margin-bottom: 20px; 8 | 9 | &:after { 10 | display: block; 11 | content: ''; 12 | background: #f6f6f6; 13 | padding-bottom: 260px; 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /source/styles/_base.scss: -------------------------------------------------------------------------------- 1 | /* ==================== 2 | Base 3 | ===================== */ 4 | 5 | body { 6 | background: white; 7 | font-family: "Helvetica Neue","Helvetica","Arial","Verdana","sans-serif"; 8 | font-weight: 400; 9 | -webkit-font-smoothing: antialiased; 10 | } 11 | 12 | * { 13 | box-sizing: border-box; 14 | } 15 | -------------------------------------------------------------------------------- /.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": [ 3 | "airbnb-base", 4 | "plugin:flowtype/recommended" 5 | ], 6 | "rules": { 7 | "semi": 0, 8 | "flowtype-errors/show-errors": 2, 9 | "import/no-extraneous-dependencies": 0, 10 | }, 11 | "globals": { 12 | "$": false 13 | }, 14 | "plugins": [ 15 | "flowtype", 16 | "flowtype-errors" 17 | ], 18 | } 19 | -------------------------------------------------------------------------------- /source/styles/modules/_welcome.scss: -------------------------------------------------------------------------------- 1 | /* ==================== 2 | Module/Welcome 3 | ===================== */ 4 | 5 | .welcome { 6 | padding: 50px 0; 7 | text-align: center; 8 | 9 | h3 { font-weight: 100; font-size: 48px; } 10 | p { font-size: 24px; font-weight: 300; color: #777; } 11 | a { color: inherit; } 12 | 13 | svg { 14 | max-width: 100px; 15 | fill: orange; 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /tasks/default.js: -------------------------------------------------------------------------------- 1 | 2 | import gulp from 'gulp'; 3 | import seq from 'run-sequence'; 4 | import { watch } from '../config'; 5 | 6 | gulp.task('default', ['clean'], () => { 7 | seq(['scripts', 'scripts:libs', 'fonts', 'images', 'markup', 'styles'], 'server'); 8 | 9 | gulp.watch(watch.images, ['images']); 10 | gulp.watch(watch.html, ['markup']); 11 | gulp.watch(watch.scss, ['styles']); 12 | gulp.watch(watch.fonts, ['fonts']); 13 | }); 14 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Distribution Folder 2 | dist/ 3 | bower_components/ 4 | node_modules/ 5 | 6 | rev-manifest.json 7 | 8 | # Environment files 9 | .env 10 | 11 | # Logs 12 | logs 13 | *.log 14 | npm-debug.log* 15 | 16 | # Runtime data 17 | pids 18 | *.pid 19 | *.seed 20 | 21 | # Directory for instrumented libs generated by jscoverage/JSCover 22 | lib-cov 23 | 24 | # Coverage directory used by tools like istanbul 25 | coverage 26 | 27 | # Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files) 28 | .grunt 29 | 30 | # node-waf configuration 31 | .lock-wscript 32 | 33 | # Compiled binary addons (http://nodejs.org/api/addons.html) 34 | build/Release 35 | -------------------------------------------------------------------------------- /source/styles/main.scss: -------------------------------------------------------------------------------- 1 | /**! 2 | * React ES6 Boilerplate 3 | * Author: @iduuck 4 | * Date: 1 October 2015 5 | * 6 | * https://github.com/nick/react-es6-boilerplate 7 | */ 8 | 9 | 10 | /**! Site settings 11 | ================================= */ 12 | 13 | @import 'site-settings'; 14 | 15 | 16 | /**! Bower Components 17 | ================================= */ 18 | 19 | @import 'bootstrap'; 20 | 21 | 22 | /**! Base 23 | ================================= */ 24 | 25 | @import 'base'; 26 | 27 | 28 | /**! Layouts 29 | ================================= */ 30 | 31 | @import 'layout/header'; 32 | 33 | 34 | /**! Modules 35 | ================================= */ 36 | 37 | @import 'modules/welcome'; 38 | @import 'modules/grid'; 39 | -------------------------------------------------------------------------------- /tasks/images.js: -------------------------------------------------------------------------------- 1 | 2 | import gulp from 'gulp'; 3 | import changed from 'gulp-changed'; 4 | import imageMinify from 'gulp-imagemin'; 5 | import { join } from 'path'; 6 | 7 | import browserSync from './connect'; 8 | import { server, watch, imagemin } from '../config'; 9 | 10 | gulp.task('images', () => { 11 | const images = gulp.src(watch.images) 12 | .pipe(changed(join(server.dest, 'images'))) 13 | .pipe(gulp.dest(join(server.dest, 'images'))) 14 | .pipe(browserSync.stream()); 15 | 16 | return images; 17 | }); 18 | 19 | gulp.task('images:build', () => { 20 | const buildImages = gulp.src(watch.images) 21 | .pipe(imageMinify(imagemin)) 22 | .pipe(gulp.dest(join(server.dest, 'images'))); 23 | 24 | return buildImages; 25 | }); 26 | -------------------------------------------------------------------------------- /source/html/partials/sprites.ejs: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /tasks/markup.js: -------------------------------------------------------------------------------- 1 | 2 | import gulp from 'gulp'; 3 | import svgmin from 'gulp-svgmin'; 4 | import cheerio from 'gulp-cheerio'; 5 | import svgstore from 'gulp-svgstore'; 6 | import ejs from 'gulp-ejs'; 7 | import rename from 'gulp-rename'; 8 | import plumber from 'gulp-plumber'; 9 | import concat from 'gulp-concat'; 10 | import { join } from 'path'; 11 | 12 | import browserSync from './connect'; 13 | import { watch, server } from '../config'; 14 | 15 | const { src, dest } = server 16 | 17 | gulp.task('sprites', () => { 18 | gulp.src(join(src, 'images', '**/*.svg')) 19 | .pipe(svgmin()) 20 | .pipe(cheerio({ 21 | run($) { $('[fill]').removeAttr('fill'); }, 22 | parserOptions: { xmlMode: true }, 23 | })) 24 | .pipe(svgstore({ inlineSvg: true })) 25 | .pipe(concat('sprites.ejs')) 26 | .pipe(gulp.dest(join(src, 'html', 'partials'))); 27 | }); 28 | 29 | gulp.task('markup', () => { 30 | gulp.src([watch.html, join('!.', src, 'html', 'partials', '**/*.ejs')]) 31 | .pipe(plumber()) 32 | .pipe(ejs()) 33 | .pipe(rename({ extname: '.html' })) 34 | .pipe(gulp.dest(dest)) 35 | .pipe(browserSync.stream()); 36 | }); 37 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2015-2016 Kreativgebiet 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /CONTRIBUTING.md: -------------------------------------------------------------------------------- 1 | # Contribution Guidelines 2 | 3 | The following is a set of guidelines for contributing to this project and its packages, which are most likely hosted on a private GitLab server of Kreativgebiet. 4 | 5 | ### Making a commit 6 | 7 | - Use the present tense ("Add feature" not "Added feature") 8 | - Use the imperative mood ("Move cursor to..." not "Moves cursor to...") 9 | - Limit the first line to 72 characters or less 10 | - Reference issues and pull requests liberally 11 | - Consider starting the commit message with an applicable emoji: 12 | - :art: `:art:` when improving the format/structure of the code 13 | - :racehorse: `:racehorse:` when improving performance 14 | - :memo: `:memo:` when doing something on the styleguide 15 | - :bug: `:bug:` when fixing a bug 16 | - :fire: `:fire:` when removing code or files 17 | - :arrow_up: `:arrow_up:` when upgrading dependencies 18 | - :arrow_down: `:arrow_down:` when downgrading dependencies 19 | - :shirt: `:shirt:` when removing linter warnings 20 | 21 | #### When using CI 22 | When only changing documentation, include [ci skip] in the commit description 23 | :green_heart: `:green_heart:` when fixing the CI build 24 | -------------------------------------------------------------------------------- /tasks/styles.js: -------------------------------------------------------------------------------- 1 | 2 | import gulp from 'gulp'; 3 | import sass from 'gulp-sass'; 4 | import postcss from 'gulp-postcss'; 5 | import sourcemaps from 'gulp-sourcemaps'; 6 | import plumber from 'gulp-plumber'; 7 | import csso from 'gulp-csso'; 8 | import rucksack from 'gulp-rucksack'; 9 | 10 | import autoprefixer from 'autoprefixer'; 11 | import { join } from 'path'; 12 | import { libraries, server } from '../config'; 13 | import browserSync from './connect'; 14 | 15 | const { src, dest } = server 16 | 17 | const sassSettings = { 18 | includePaths: libraries.scss, 19 | }; 20 | 21 | gulp.task('styles', () => { 22 | gulp.src(join(src, 'styles', 'main.scss')) 23 | .pipe(plumber()) 24 | .pipe(sourcemaps.init()) 25 | .pipe(sass(sassSettings)) 26 | .pipe(postcss([autoprefixer({ browsers: ['last 2 versions'] })])) 27 | .pipe(rucksack()) 28 | .pipe(csso()) 29 | .pipe(sourcemaps.write('.')) 30 | .pipe(gulp.dest(join(dest, 'styles'))) 31 | .pipe(browserSync.stream()); 32 | }); 33 | 34 | gulp.task('styles:build', () => { 35 | gulp.src(join(src, 'styles', 'main.scss')) 36 | .pipe(plumber()) 37 | .pipe(sass(sassSettings)) 38 | .pipe(postcss([autoprefixer({ browsers: ['last 2 versions'] })])) 39 | .pipe(rucksack()) 40 | .pipe(csso()) 41 | .pipe(gulp.dest(join(dest, 'styles'))); 42 | }); 43 | -------------------------------------------------------------------------------- /tasks/scripts.js: -------------------------------------------------------------------------------- 1 | 2 | import gulp from 'gulp'; 3 | import gutil from 'gulp-util'; 4 | import uglify from 'gulp-uglify'; 5 | import browserify from 'browserify'; 6 | import watchify from 'watchify'; 7 | import source from 'vinyl-source-stream'; 8 | import buffer from 'vinyl-buffer'; 9 | import { join } from 'path'; 10 | 11 | import browserSync from './connect'; 12 | import { libraries, server, browserify as blabla } from '../config'; 13 | 14 | const { dest } = server 15 | const config = Object.assign({}, watchify.args, blabla); 16 | const bundler = watchify(browserify(config)); 17 | const buildBundler = browserify(config); 18 | 19 | function bundle() { 20 | return bundler.bundle() 21 | .on('error', err => gutil.log.call(this, err)) 22 | .pipe(source('bundle.min.js')) 23 | .pipe(buffer()) 24 | .pipe(gulp.dest(dest)) 25 | .pipe(browserSync.stream()); 26 | } 27 | 28 | function buildBundle() { 29 | return buildBundler.bundle() 30 | .on('error', err => gutil.log.call(this, err)) 31 | .pipe(source('bundle.min.js')) 32 | .pipe(buffer()) 33 | .pipe(uglify()) 34 | .pipe(gulp.dest(dest)); 35 | } 36 | 37 | gulp.task('scripts:libs', () => { 38 | gulp.src(libraries.js) 39 | .pipe(gulp.dest(join(dest, 'lib'))); 40 | }) 41 | 42 | gulp.task('scripts', bundle); 43 | gulp.task('scripts:build', buildBundle); 44 | bundler.on('update', bundle); 45 | bundler.on('log', gutil.log); 46 | -------------------------------------------------------------------------------- /source/html/index.ejs: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Kickup Boilerplate 6 | 7 | 8 | 9 | 10 |
11 | <%- include partials/sprites.ejs %> 12 |
13 | 14 |
15 |
16 |
17 | 18 |

Welcome to the Boilerplate!

19 |

If you like this please Follow me on Twitter or on GitHub!

20 |
21 |
22 | 23 |
24 |
25 |
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 | 37 | 38 | 39 | 40 | 41 | -------------------------------------------------------------------------------- /source/images/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "kickup", 3 | "version": "0.5.0", 4 | "description": "Boilerplate for a combination of ECMAScript 6 and Gulp.js", 5 | "repository": "git@github.com:kreativgebiet/kickup.git", 6 | "main": "gulpfile.babel.js", 7 | "scripts": { 8 | "lint": "eslint --format=node_modules/eslint-formatter-pretty . *.js", 9 | "test": "ava" 10 | }, 11 | "keywords": [ 12 | "boilerplate", 13 | "preset", 14 | "gulp", 15 | "es6", 16 | "gulpjs" 17 | ], 18 | "author": "Dominik Schmidt ", 19 | "license": "MIT", 20 | "devDependencies": { 21 | "ava": "^0.18.0", 22 | "autoprefixer": "^7.0.0", 23 | "babel-core": "^6.21.0", 24 | "babel-eslint": "^7.1.1", 25 | "babel-preset-es2015": "^6.18.0", 26 | "babelify": "^7.3.0", 27 | "bootstrap": "4.0.0-alpha.5", 28 | "browser-sync": "^2.18.5", 29 | "browserify": "^14.0.0", 30 | "eslint": "^3.12.2", 31 | "eslint-config-airbnb-base": "latest", 32 | "eslint-formatter-pretty": "^1.1.0", 33 | "eslint-plugin-flowtype": "^2.41.1", 34 | "eslint-plugin-flowtype-errors": "^3.0.0", 35 | "eslint-plugin-import": "^2.2.0", 36 | "eslint-plugin-jsx-a11y": "^4.0.0", 37 | "flow-bin": "latest", 38 | "gulp": "^3.9.1", 39 | "gulp-changed": "^2.0.0", 40 | "gulp-cheerio": "^0.6.2", 41 | "gulp-concat": "^2.6.1", 42 | "gulp-csso": "^3.0.0", 43 | "gulp-ejs": "^3.0.0", 44 | "gulp-file-include": "^1.0.0", 45 | "gulp-imagemin": "^3.1.1", 46 | "gulp-inject": "^4.2.0", 47 | "gulp-plumber": "^1.1.0", 48 | "gulp-postcss": "^7.0.0", 49 | "gulp-rename": "^1.2.2", 50 | "gulp-rev": "^7.1.2", 51 | "gulp-rucksack": "^0.1.3", 52 | "gulp-sass": "^3.0.0", 53 | "gulp-sourcemaps": "^2.2.2", 54 | "gulp-svgmin": "^1.2.3", 55 | "gulp-svgstore": "^6.1.0", 56 | "gulp-uglify": "^3.0.0", 57 | "gulp-util": "^3.0.8", 58 | "require-dir": "^0.3.1", 59 | "rimraf": "^2.5.4", 60 | "rsyncwrapper": "^2.0.1", 61 | "run-sequence": "^1.2.2", 62 | "vinyl-buffer": "^1.0.0", 63 | "vinyl-source-stream": "^1.1.0", 64 | "watchify": "^3.8.0" 65 | }, 66 | "dependencies": {} 67 | } 68 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # kickup 2 | 3 | [![Dependency Status](https://david-dm.org/kreativgebiet/kickup/dev-status.svg)](https://david-dm.org/kreativgebiet/kickup) [![Part of the Kreativgebiet - Laboratory Project](https://img.shields.io/badge/laboratory-project-red.svg)](http://labs.kreativgebiet.com/) 4 | 5 | Boilerplate for your perfect front-end environment (utilizing Gulp.js, Babel, and more) 6 | 7 | ## Requirements 8 | 9 | - Working personal computer 10 | - Node.js 11 | 12 | ## Getting Started 13 | Change into your directory and run the following command in the Terminal of your choice: 14 | 15 | ```bash 16 | curl -fsSL https://github.com/kreativgebiet/kickup/archive/master.tar.gz | tar -xz --strip-components 1 17 | ``` 18 | 19 | You can also `git clone` or [download](https://github.com/kreativgebiet/kickup/archive/master.zip) this repo and remove the `.git` folder. 20 | 21 | ### Install dependencies 22 | 23 | ```bash 24 | yarn install 25 | ``` 26 | 27 | ### Run 28 | 29 | ```bash 30 | gulp 31 | ``` 32 | 33 | ## What's included? 34 | 35 | ### Technology 36 | 37 | - [Gulp.js](http://gulpjs.com/) – Automate and enhance your workflow. 38 | - [BrowserSync](https://www.browsersync.io/) – Time-saving synchronised browser testing. 39 | - [Rsync](https://en.wikipedia.org/wiki/Rsync) – Deployment made easy. 40 | 41 | ### Stylesheets 42 | 43 | - [Autoprefixer](https://github.com/postcss/autoprefixer) – Parse CSS and add vendor prefixes to rules by Can I Use. 44 | - [Sass](http://sass-lang.com/) – Sass makes CSS fun again. 45 | - [CSSO](http://css.github.io/csso/) - CSS Optimization. 46 | - [PostCSS](https://github.com/postcss/postcss) – A tool for transforming styles with JS plugins. 47 | 48 | ### Javascript (ES6) 49 | 50 | - [Browserify](http://browserify.org/) – Bundling up all of your dependencies. 51 | - [Babel](https://babeljs.io/) – A compiler for writing next generation JavaScript. 52 | - [ESLint](http://eslint.org/) – The pluggable linting utility for JavaScript and JSX. 53 | - [UglifyJS](https://github.com/mishoo/UglifyJS2) – A JavaScript parser, minifier, compressor or beautifier toolkit. 54 | 55 | ### Miscellaneous 56 | 57 | - [SVGStore](https://github.com/w0rm/gulp-svgstore) – Combine svg files into one with elements. 58 | 59 | ## License 60 | 61 | MIT © [Kreativgebiet](http://kreativgebiet.com) 62 | -------------------------------------------------------------------------------- /config.js: -------------------------------------------------------------------------------- 1 | 2 | import { join } from 'path'; 3 | import babelify from 'babelify'; 4 | 5 | const sourceFolder = 'source'; 6 | const distFolder = 'dist'; 7 | 8 | module.exports = { 9 | // ---------------------------- 10 | // LIBRARIES module 11 | // ---------------------------- 12 | libraries: { 13 | // The entries in js are needed to be a *glob* 14 | js: [ 15 | join(__dirname, 'node_modules', 'jquery', 'dist', 'jquery.min.js'), 16 | join(__dirname, 'source', 'scripts', 'lib', '**', '*.js'), 17 | // TODO: Add some more libraries to work with them in your js files 18 | ], 19 | 20 | // The entries in scss are needed to be *folders* 21 | scss: [ 22 | join(__dirname, 'node_modules', 'bootstrap', 'scss'), 23 | // TODO: Add some more libraries to include them in your scss files 24 | ], 25 | }, 26 | 27 | // ---------------------------- 28 | // RSYNC module 29 | // ---------------------------- 30 | rsync: { 31 | src: `${distFolder}/`, 32 | dest: 'user@host:folder/to/script', 33 | ssh: true, 34 | recursive: true, 35 | deleteAll: true, 36 | exclude: ['.DS_Store'], 37 | }, 38 | 39 | // ---------------------------- 40 | // IMAGEMIN module 41 | // ---------------------------- 42 | imagemin: {}, 43 | 44 | // ---------------------------- 45 | // WATCH module 46 | // ---------------------------- 47 | watch: { 48 | images: join(sourceFolder, 'images', '**/*'), 49 | scss: join(sourceFolder, 'styles', '**/*.{scss,sass}'), 50 | js: undefined, // JavaScript is watched using watchify 51 | html: join(sourceFolder, 'html', '**/*.ejs'), 52 | fonts: join(sourceFolder, 'fonts', '**/*'), 53 | }, 54 | 55 | // ---------------------------- 56 | // SERVER module 57 | // ---------------------------- 58 | server: { 59 | src: `${sourceFolder}/`, 60 | dest: `${distFolder}/`, 61 | 62 | // ---------------------------- 63 | // BROWSERSYNC module 64 | // ---------------------------- 65 | browserSync: { 66 | port: 3000, 67 | notify: false, 68 | server: { 69 | baseDir: distFolder, 70 | }, 71 | }, 72 | }, 73 | 74 | // ---------------------------- 75 | // BROWSERSYNC module 76 | // ---------------------------- 77 | browserify: { 78 | entries: join(sourceFolder, 'scripts', 'main.js'), 79 | extensions: ['.jsx', '.js'], 80 | debug: process.env.NODE_ENV === 'development', 81 | transform: [ 82 | babelify, 83 | ], 84 | }, 85 | } 86 | --------------------------------------------------------------------------------