Initial commit

.gitignore

+dist/
+
+# Dependency directories
+node_modules/
+
+# Logs
+logs/
+*.log
+npm-debug.log*
+
+# Optional npm cache directory
+.npm/
+
+# Optional REPL history
+.node_repl_history/

.gitlab-ci.yml

+stages:
+  - build
+  - deploy
+  - build:production
+  - deploy:production
+
+.cache-and-save-artifacts: &cache-and-save-artifacts
+  cache:
+    paths:
+      - node_modules/
+  artifacts:
+    paths:
+      - dist/
+
+build:testing:
+  stage: build
+  script:
+    - node -v
+    - npm -v
+    - npm run build-testing
+  tags:
+    - npm
+  <<: *cache-and-save-artifacts
+  only:
+    - branches
+  except:
+    - master
+
+build:staging:
+  stage: build
+  script:
+    - node -v
+    - npm -v
+    - npm run build-staging
+  tags:
+    - npm
+  <<: *cache-and-save-artifacts
+  only:
+    - master
+
+build:production:
+  stage: build:production
+  script:
+    - node -v
+    - npm -v
+    - npm run build
+  when: manual
+  allow_failure: false
+  tags:
+    - npm
+  <<: *cache-and-save-artifacts
+  only:
+    - master
+
+deploy:review:
+  stage: deploy
+  variables:
+    GIT_STRATEGY: none
+  script:
+    - rsync -rv --delete dist/ /test/$CI_PROJECT_NAME--$CI_COMMIT_REF_SLUG/
+  dependencies:
+    - build:testing
+  tags:
+    - gviagroup-deploy
+  environment:
+    name: review/$CI_COMMIT_REF_NAME
+    url: http://$CI_COMMIT_REF_SLUG.$CI_PROJECT_NAME.test.$DOMAIN
+    on_stop: undeploy:review
+  only:
+    - branches
+  except:
+    - master
+    - dev
+
+deploy:testing:
+  stage: deploy
+  variables:
+    GIT_STRATEGY: none
+  script:
+    - rsync -rv --delete dist/ /test/$CI_PROJECT_NAME/
+  dependencies:
+    - build:testing
+  tags:
+    - gviagroup-deploy
+  environment:
+    name: testing
+    url: http://$CI_PROJECT_NAME.test.$DOMAIN
+    on_stop: undeploy:testing
+  only:
+    - dev
+  except:
+    - tags
+
+deploy:staging:
+  stage: deploy
+  variables:
+    GIT_STRATEGY: none
+  script:
+    - rsync -rv --delete dist/ /demo/$CI_PROJECT_NAME/
+  dependencies:
+    - build:staging
+  tags:
+    - gviagroup-deploy
+  environment:
+    name: staging
+    url: http://$CI_PROJECT_NAME.demo.$DOMAIN
+    on_stop: undeploy:staging
+  only:
+    - master
+
+deploy:production:
+  stage: deploy:production
+  variables:
+    GIT_STRATEGY: none
+  script:
+    - deploy html dist/
+    - deploy --chown
+  dependencies:
+    - build:production
+  tags:
+    - gviagroup-hosting
+  environment:
+    name: production
+    url: $HOSTING_PROJECT_URL
+  only:
+    - master
+
+undeploy:review:
+  stage: deploy
+  variables:
+    GIT_STRATEGY: none
+  script:
+    - rm -rf /test/$CI_PROJECT_NAME--$CI_COMMIT_REF_SLUG
+  when: manual
+  tags:
+    - gviagroup-deploy
+  environment:
+    name: review/$CI_COMMIT_REF_NAME
+    action: stop
+  only:
+    - branches
+  except:
+    - master
+    - dev
+
+undeploy:testing:
+  stage: deploy
+  variables:
+    GIT_STRATEGY: none
+  script:
+    - rm -rf /test/$CI_PROJECT_NAME
+  when: manual
+  tags:
+    - gviagroup-deploy
+  environment:
+    name: testing
+    action: stop
+  only:
+    - dev
+  except:
+    - tags
+
+undeploy:staging:
+  stage: deploy
+  variables:
+    GIT_STRATEGY: none
+  script:
+    - rm -rf /demo/$CI_PROJECT_NAME
+  when: manual
+  tags:
+    - gviagroup-deploy
+  environment:
+    name: staging
+    action: stop
+  only:
+    - master

.gitlab/route-map.yml

+- source: /src\/(css|less)\/.+/
+  public: 'css/style.all.min.css'
+- source: /src\/img\/(.+)/
+  public: 'img/\1'
+- source: /src\/js\/.+/
+  public: 'js/script.all.min.js'
+- source: /src\/pug\/(?!includes\/)(.+)\.pug/
+  public: '\1.html'
+- source: /src\/(.+\.html)/
+  public: '\1'

bs-config.json

+{
+	"files": [
+		"./dist/**/*.{css,html,htm,js}"
+	],
+	"reloadDebounce": 500,
+	"server": {
+		"baseDir": "dist"
+	},
+	"watchOptions": {
+		"ignored": ["./**/*", "!./dist/**/*"]
+	}
+}

gulpfile.js

+var browserify = require('browserify');
+var source     = require('vinyl-source-stream');
+var vueify     = require('vueify');
+var envify     = require('envify/custom');
+
+var gulp      = require('gulp');
+var nano      = require('gulp-cssnano');
+var htmlMin   = require('gulp-htmlmin');
+var inject    = require('gulp-inject-string');
+var less      = require('gulp-less');
+var pug       = require('gulp-pug');
+var rename    = require('gulp-rename');
+var streamify = require('gulp-streamify');
+var uglify    = require('gulp-uglify');
+var gutil     = require('gulp-util');
+
+var failsafe = false;
+
+function isLocal() {
+	return !gutil.env.env;
+}
+function isTesting() {
+	return gutil.env.env === 'testing';
+}
+function isStaging() {
+	return gutil.env.env === 'staging';
+}
+function isProduction() {
+	return gutil.env.env === 'production';
+}
+
+function failsafePipe(pipe, callback) {
+	return failsafe
+		? pipe.on('error', shallow(callback))
+		: pipe;
+}
+function shallow(callback) {
+	return function (error) {
+		callback(error);
+	};
+}
+
+var paths = new function() {
+	this.srcDir  = 'src';
+	this.distDir = 'dist';
+	
+	// Files to be copied to `distDir`
+	this.files = [
+		// this.srcDir + '/folder/**/*' // Copy whole folder with subfolders
+		// this.srcDir + '/file.txt'    // Copy specified file
+	];
+	
+	this.cssDir   = this.srcDir + '/css';
+	this.cssFiles = this.cssDir + '/**/*.css';
+	
+	this.htmlDir   = this.srcDir;
+	this.html      = this.htmlDir + '/**/*.html';
+	this.htmlFiles = this.html;
+	this.htmlOut   = this.distDir;
+	
+	this.imgDir   = this.srcDir + '/img';
+	this.imgFiles = this.imgDir + '/**/*';
+	this.imgOut   = this.distDir + '/img';
+	
+	this.jsDir   = this.srcDir + '/js';
+	this.js      = this.jsDir + '/index.js';
+	this.jsFiles = [
+		this.jsDir  + '/**/*.js',
+		this.srcDir + '/vue/**/*'
+	];
+	this.jsOut   = this.distDir + '/js';
+	
+	this.lessDir   = this.srcDir + '/less';
+	this.less      = this.lessDir + '/index.less';
+	this.lessFiles = this.lessDir + '/**/*.less';
+	this.lessOut   = this.distDir + '/css';
+	
+	this.pugDir   = this.srcDir + '/pug';
+	this.pug      = [
+		this.pugDir + '/**/*.pug',
+		'!' + this.pugDir + '/includes/**/*'
+	];
+	this.pugFiles = this.pugDir + '/**/*';
+	this.pugOut   = this.distDir;
+};
+
+// Files
+
+gulp.task('files-copy', function () {
+	return gulp.src(paths.files, {
+		base: paths.srcDir
+	})
+		.pipe(gulp.dest(paths.distDir));
+});
+gulp.task('files', ['files-copy']);
+
+// Images
+
+gulp.task('img-copy', function () {
+	return gulp.src(paths.imgFiles)
+		.pipe(gulp.dest(paths.imgOut));
+});
+gulp.task('images', ['img-copy']);
+
+// Markup
+
+gulp.task('html-min', function (callback) {
+	return gulp.src(paths.html)
+		.pipe(isLocal() || isTesting()
+			? inject.replace('<!--\\s*?weinre\\s*?-->', '<script async src="http://weinre.dev.gvia.group/target/target-script-min.js"></script>')
+			: gutil.noop())
+		.pipe(isStaging()
+			? inject.replace('<!--\\s*?weinre\\s*?-->', '<script async src="http://weinre.dev.gvia.group/target/target-script-min.js#staging"></script>')
+			: gutil.noop())
+		.pipe(isProduction()
+			? inject.replace('<!--\\s*?weinre\\s*?-->', '')
+			: gutil.noop())
+		.pipe(failsafePipe(htmlMin({
+			collapseWhitespace: true,
+			conservativeCollapse: true
+		}), callback))
+		.pipe(gulp.dest(paths.htmlOut));
+});
+gulp.task('pug-compile', function (callback) {
+	return gulp.src(paths.pug)
+		.pipe(isLocal() || isTesting()
+			? inject.replace('//-?\\s*?weinre', 'script(async src="http://weinre.dev.gvia.group/target/target-script-min.js")')
+			: gutil.noop())
+		.pipe(isStaging()
+			? inject.replace('//-?\\s*?weinre', 'script(async src="http://weinre.dev.gvia.group/target/target-script-min.js#staging")')
+			: gutil.noop())
+		.pipe(isProduction()
+			? inject.replace('//-?\\s*?weinre', '')
+			: gutil.noop())
+		.pipe(failsafePipe(pug(), callback))
+		.pipe(gulp.dest(paths.pugOut));
+});
+gulp.task('markup', ['html-min', 'pug-compile']);
+
+// Scripts
+
+gulp.task('js-browserify', function (callback) {
+	return failsafePipe(
+		browserify(paths.js, {
+			debug: isLocal(),
+			transform: [
+				vueify
+			]
+		})
+			.transform(
+				{global: !isLocal()},
+				envify(!isLocal() ? {NODE_ENV: 'production'} : {}))
+			.bundle(),
+		callback)
+		.pipe(source('script.all.min.js'))
+		.pipe(!isLocal() ? streamify(failsafePipe(uglify(), callback)) : gutil.noop())
+		.pipe(gulp.dest(paths.jsOut));
+});
+gulp.task('scripts', ['js-browserify']);
+
+// Styles
+
+gulp.task('less-compile', function (callback) {
+	return gulp.src(paths.less)
+		.pipe(failsafePipe(less(), callback))
+		.pipe(!isLocal() ? failsafePipe(nano(), callback) : gutil.noop())
+		.pipe(rename('style.all.min.css'))
+		.pipe(gulp.dest(paths.lessOut));
+});
+gulp.task('styles', ['less-compile']);
+
+// Stages
+
+gulp.task('watch', function () {
+	failsafe = true;
+	gulp.watch(paths.files, ['files']);
+	gulp.watch(paths.imgFiles, ['images']);
+	gulp.watch([paths.htmlFiles, paths.pugFiles], ['markup']);
+	gulp.watch(paths.jsFiles, ['scripts']);
+	gulp.watch([paths.cssFiles, paths.lessFiles], ['styles']);
+});
+
+gulp.task('build', ['files', 'images', 'markup', 'scripts', 'styles']);
+
+gulp.task('default', ['build']);

package.json

+{
+	"name":    "project",
+	"version": "version",
+	
+	"scripts": {
+		"prestart": "npm install",
+		"start":    "gulp && concurrently \"gulp watch\" \"lite-server\"",
+		
+		"build-testing": "npm install && gulp --env testing",
+		"build-staging": "npm install && gulp --env staging",
+		"build":         "npm install && gulp --env production"
+	},
+	
+	"devDependencies": {
+		"browserify":          "^14.4.0",
+		"concurrently":        "^3.4.0",
+		"lite-server":         "^2.3.0",
+		"gulp-streamify":      "^1.0.2",
+		"vinyl-source-stream": "^1.1.0",
+		"gulp":                "^3.9.1",
+		"gulp-cssnano":        "^2.1.2",
+		"gulp-htmlmin":        "^3.0.0",
+		"gulp-inject-string":  "^1.1.0",
+		"gulp-less":           "^3.3.0",
+		"gulp-pug":            "^3.3.0",
+		"gulp-rename":         "^1.2.2",
+		"gulp-uglify":         "^2.1.0",
+		"gulp-util":           "^3.0.8",
+		
+		"jquery": "^3.2.1",
+		
+		"vue":        "^2.5.13",
+		"vueify":     "^9.4.1",
+		"envify":     "^4.1.0",
+		"vue-router": "^3.0.1",
+		"vuex":       "^3.0.1"
+	}
+}

src/index.html

+<!DOCTYPE html>
+<html lang="en">
+<head>
+	<meta charset="UTF-8">
+	<title>Project</title>
+	
+	<script defer src="/js/script.all.min.js"></script>
+	<link rel="stylesheet" href="/css/style.all.min.css">
+</head>
+<body>
+<!-- weinre -->
+
+<div id="app"></div>
+
+</body>
+</html>

src/js/app.js

+'use strict';
+
+var Vue = require('vue/dist/vue.common');
+
+var app = new Vue({
+	el: '#app',
+	render: function (h) { return h(require('../vue/index.vue')); },
+	router: require('./app.router'),
+	store:  require('./app.store'),
+	created: function () {
+		this.$store.dispatch('getData');
+	}
+});

src/js/app.router.js

+'use strict';
+
+var Vue       = require('vue/dist/vue.common');
+var VueRouter = require('vue-router');
+
+Vue.use(VueRouter);
+
+var routes = [
+	{
+		name: 'home',
+		path: '/',
+		component: require('../vue/pages/home.vue')
+	}
+];
+
+module.exports = new VueRouter({
+	mode: 'history',
+	routes: routes,
+	scrollBehavior: function () {
+		return {x: 0, y: 0};
+	}
+});

src/js/app.store.js

+'use strict';
+
+var Vue  = require('vue/dist/vue.common');
+var Vuex = require('vuex');
+
+Vue.use(Vuex);
+
+module.exports = new Vuex.Store({
+	modules: {
+		module: require('./store/module.store')
+	},
+	actions: {
+		getData: function (context) {
+			context.dispatch('module/...');
+		}
+	}
+});

src/js/functions.js

+'use strict';
+
+var $ = require('jquery');
+
+module.exports = {
+	/*
+	 * Functions to be exported go here. Format:
+	 * exportName: functionName
+	 */
+};
+
+// Code goes here

src/js/index.js

+'use strict';
+
+var $ = window.$ = window.jQuery = require('jquery');
+var functions = require('./functions');
+
+require('./app');
+
+/*
+ * Exported in 'functions.js' functions can be used here:
+ * functions.exportName()
+ */
+
+$(function () {
+
+	// Code goes here
+
+});

src/js/store/module.store.js

+module.exports = {
+	namespaced: true,
+	state: {
+	
+	},
+	getters: {
+	
+	},
+	mutations: {
+	
+	},
+	actions: {
+	
+	}
+};

src/less/global.less

+/*
+ * Global styles go here
+ */

src/less/index.less

+/*
+ * Imports go here
+ * http://lesscss.org/features/#import-options
+ */
+
+@import "global";
+@import "style";
+@import "media";

src/less/media.less

+/*
+ * Styles for different media types/devices go here
+ */

src/less/style.less

+/*
+ * Styles go here
+ */

src/pug/includes/mixins.pug

+mixin head(title)
+	head
+		meta(charset="UTF-8")
+		title= title
+
+		script(defer src="/js/script.all.min.js")
+		link(rel="stylesheet" href="/css/style.all.min.css")
+
+		block

src/pug/index.pug

+include includes/mixins
+
+doctype html
+html(lang="en")
+	+head('Project')
+	body
+		//- weinre
+
+		#app

src/vue/index.vue

+<template>
+	<router-view/>
+</template>

src/vue/pages/home.vue

+<template>
+	
+</template>
+
+<script>
+	module.exports = {
+	
+	};
+</script>