[!!!][TASK] Replace grunt with gulp

This commit is contained in:
Xaver Maierhofer 2017-03-22 23:13:37 +01:00 committed by Xaver Maierhofer
parent 94627fc611
commit 78b6157fde
23 changed files with 1821 additions and 841 deletions

View File

@ -30,4 +30,4 @@ before_script:
- if git status | grep -q "modified. \.travis\.yml"; then echo "Dirty yarn.lock"; exit 1; fi - if git status | grep -q "modified. \.travis\.yml"; then echo "Dirty yarn.lock"; exit 1; fi
script: script:
- grunt - gulp

View File

@ -1,9 +0,0 @@
module.exports = function exports(grunt) {
'use strict';
grunt.loadTasks('tasks');
grunt.registerTask('default', ['lint', 'copy', 'sass:dist', 'postcss:dist', 'requirejs:default', 'cachebreaker', 'inline', 'htmlmin', 'json-minify', 'clean:release']);
grunt.registerTask('lint', ['sasslint', 'eslint']);
grunt.registerTask('serve', ['lint', 'copy', 'sass:dev', 'postcss:dev', 'requirejs:dev', 'inline:dev', 'htmlmin', 'json-minify', 'browserSync', 'watch']);
};

View File

@ -18,9 +18,9 @@ _Some similar features might have been implemented/merged_
- Formatted Code - Formatted Code
- Translation support - https://crowdin.com/project/meshviewer - Contact us for new languages - Translation support - https://crowdin.com/project/meshviewer - Contact us for new languages
- Currently available: en, de, fr & ru - Currently available: en, de, fr & ru
- Grunt inline for some css and js - less requests - Gulp inline for some css and js - less requests and instant load indicator
- Icon font with needed icons only - Icon font with needed icons only
- Grunt upgraded to v1.x (Tested with Node.js 4/6 LTS, 7 on Linux, 7 OSX & W**) - Switch to Gulp (Tested with Node.js 4/6 LTS, 7 on Linux, 7 OSX & W**)
- css and some js moved inline - css and some js moved inline
- Yarn/npm in favour of bower - Yarn/npm in favour of bower
- Load only moment.js without languages (Languages are included in translations) - Load only moment.js without languages (Languages are included in translations)

View File

@ -1,4 +1,4 @@
// Grunt will remove all comments // Gulp will remove all comments
{ {
// Variables are NODE_ID and NODE_NAME (only a-z0-9\- other chars are replaced with _) // Variables are NODE_ID and NODE_NAME (only a-z0-9\- other chars are replaced with _)
"nodeInfos": [ "nodeInfos": [
@ -128,5 +128,5 @@
"fr", "fr",
"ru" "ru"
], ],
"cacheBreaker": "vy0zx" "cacheBreaker": "<!-- inject:cache-breaker -->"
} }

46
gulp/config.js Normal file
View File

@ -0,0 +1,46 @@
module.exports = function () {
const build = 'build';
return {
build: build,
src: {
sass: 'scss/**/*.scss',
javascript: ['app.js', 'lib/**/*.js'],
json: 'locale/*.json',
html: ['html/index.html', 'config.json']
},
clean: [build + '/*.map', build + '/vendor', build + '/main.css'],
autoprefixer: ['> 1% in DE'],
browsersync: {
server: {
baseDir: build
},
files: [
build + '/*.css',
build + '/*.js',
build + '/*.html',
build + '/locale/*.json'
]
},
requireJs: {
prod: {
baseUrl: 'lib',
name: '../node_modules/almond/almond',
mainConfigFile: 'app.js',
include: '../app',
out: 'app.js',
build: true,
preserveLicenseComments: true
},
dev: {
baseUrl: 'lib',
name: '../node_modules/almond/almond',
mainConfigFile: 'app.js',
include: '../app',
optimize: 'none',
out: 'app.js',
build: false
}
}
};
};

39
gulp/serve.js Normal file
View File

@ -0,0 +1,39 @@
module.exports = function (gulp, plugins, config, env) {
const browserSync = require('browser-sync');
function getTask(task) {
return require('./tasks/' + task)(gulp, plugins, config, env);
}
gulp.task('ws', () =>
browserSync(config.browsersync)
);
gulp.task('watch:html', () =>
gulp.watch(config.src.html,
gulp.parallel(getTask('html'))
)
);
gulp.task('watch:javascript', () =>
gulp.watch(config.src.javascript,
gulp.parallel(getTask('eslint'), getTask('javascript'))
)
);
gulp.task('watch:styles', () =>
gulp.watch(config.src.sass,
gulp.parallel(getTask('sasslint'), getTask('sass'))
)
);
gulp.task('watch:json', () =>
gulp.watch(config.src.json,
gulp.parallel(getTask('jsonMinify'))
)
);
gulp.task('watch',
gulp.parallel('watch:html', 'watch:styles', 'watch:javascript', 'watch:json')
);
};

6
gulp/tasks/clean.js Normal file
View File

@ -0,0 +1,6 @@
const del = require('del');
module.exports = function (gulp, plugins, config) {
return function clean() {
return del(config.clean);
};
};

11
gulp/tasks/copy.js Normal file
View File

@ -0,0 +1,11 @@
module.exports = function (gulp, plugins, config) {
return function copy() {
gulp.src(['html/*.html', 'assets/favicon/*'])
.pipe(gulp.dest(config.build));
gulp.src('node_modules/promise-polyfill/promise.js')
.pipe(gulp.dest(config.build + '/vendor'));
return gulp.src(['assets/fonts/*', 'assets/icons/fonts/*'])
.pipe(gulp.dest(config.build + '/fonts'));
};
};

8
gulp/tasks/eslint.js Normal file
View File

@ -0,0 +1,8 @@
module.exports = function (gulp, plugins, config, env) {
return function eslint() {
return gulp.src(['app.js', 'gulpfile.js', 'lib/**/*.js', 'gulp/**/*.js'])
.pipe(plugins.eslint())
.pipe(plugins.eslint.format())
.pipe(env.production(plugins.eslint.failAfterError()));
};
};

26
gulp/tasks/html.js Normal file
View File

@ -0,0 +1,26 @@
module.exports = function (gulp, plugins, config, env) {
return function html() {
return gulp.src(env.production() ? config.build + '/*.html' : 'html/*.html')
.pipe(plugins.inject(gulp.src(['config.json']), {
starttag: '<!-- inject:config -->',
transform: function (filePath, file) {
return '<script>var jsonData =' +
file.contents.toString('utf8')
.replace('<!-- inject:cache-breaker -->',
Math.random().toString(12).substring(7)) +
';</script>'
;
}
}))
.pipe(env.production(plugins.kyhInlineSource({ compress: false })))
.pipe(plugins.cacheBust({
type: 'timestamp'
}))
.pipe(plugins.htmlmin({
removeComments: true,
collapseWhitespace: true,
minifyJS: true
}))
.pipe(gulp.dest(config.build));
};
};

10
gulp/tasks/javascript.js Normal file
View File

@ -0,0 +1,10 @@
module.exports = function (gulp, plugins, config, env) {
return function javascript() {
return gulp.src('app.js')
.pipe(env.development(plugins.sourcemaps.init()))
.pipe(plugins.requirejsOptimize(env.production() ? config.requireJs.prod : config.requireJs.dev))
.pipe(env.production(plugins.uglify({ preserveComments: 'license' })))
.pipe(env.development(plugins.sourcemaps.write('.', { addComment: true })))
.pipe(gulp.dest(config.build));
};
};

7
gulp/tasks/jsonMinify.js Normal file
View File

@ -0,0 +1,7 @@
module.exports = function (gulp, plugins, config) {
return function jsonMinify() {
return gulp.src(config.src.json)
.pipe(plugins.jsonminify())
.pipe(gulp.dest(config.build + '/locale'));
};
};

15
gulp/tasks/sass.js Normal file
View File

@ -0,0 +1,15 @@
module.exports = function (gulp, plugins, config, env) {
return function sass() {
return gulp.src('scss/*.scss')
.pipe(env.development(plugins.sourcemaps.init()))
.pipe(plugins.sass({
outputStyle: 'compressed',
sourceMap: false
}))
.pipe(plugins.autoprefixer({
browsers: config.autoprefixer
}))
.pipe(env.development(plugins.sourcemaps.write('.', { addComment: true })))
.pipe(gulp.dest(config.build));
};
};

8
gulp/tasks/sasslint.js Normal file
View File

@ -0,0 +1,8 @@
module.exports = function (gulp, plugins, config, env) {
return function sasslint() {
return gulp.src('scss/*.scss')
.pipe(plugins.sassLint())
.pipe(plugins.sassLint.format())
.pipe(env.production(plugins.sassLint.failOnError()));
};
};

View File

@ -0,0 +1,6 @@
module.exports = function (gulp, plugins, config, env) {
return function setDevelopment(done) {
plugins.environments.current(env.development);
done();
};
};

35
gulpfile.js Normal file
View File

@ -0,0 +1,35 @@
const gulp = require('gulp');
const plugins = require('gulp-load-plugins')();
const config = require('./gulp/config')();
const env = {
development: plugins.environments.development,
production: plugins.environments.production
};
// Default environment is production
plugins.environments.current(env.production);
function getTask(task) {
return require('./gulp/tasks/' + task)(gulp, plugins, config, env);
}
require('./gulp/serve')(gulp, plugins, config, env);
gulp.task('serve',
gulp.series(
getTask('setDevelopment'),
gulp.parallel(getTask('eslint'), getTask('sasslint')),
gulp.parallel(getTask('copy'), getTask('javascript'), getTask('sass'), getTask('jsonMinify')),
getTask('html'),
gulp.parallel('watch', 'ws')
)
);
gulp.task('default',
gulp.series(
gulp.parallel(getTask('eslint'), getTask('sasslint')),
gulp.parallel(getTask('copy'), getTask('javascript'), getTask('sass'), getTask('jsonMinify')),
getTask('html'),
getTask('clean')
)
);

View File

@ -3,14 +3,12 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<link rel="stylesheet" href="main.css?__build=true"> <link rel="stylesheet" href="main.css" inline>
<style class="css-mode night" media="not"> <link rel="stylesheet" class="css-mode night" media="not" href="night.css" inline>
<inline src="night.css" /> <!-- inject:config -->
</style> <!-- contents of html partials will be injected here -->
<script> <!-- endinject -->
var jsonData = <inline src="config.json" />; <script src="vendor/promise.js" inline></script>
</script>
<script src="vendor/promise-polyfill/promise.js?__build=true"></script>
<script src="app.js"></script> <script src="app.js"></script>
</head> </head>
<body> <body>

View File

@ -8,30 +8,28 @@
"bugs": { "bugs": {
"url": "https://github.com/ffrgb/meshviewer/issues" "url": "https://github.com/ffrgb/meshviewer/issues"
}, },
"scripts": {
"test": "node -e \"require('grunt').cli()\" '' clean lint"
},
"devDependencies": { "devDependencies": {
"autoprefixer": "^6.7.7", "babel-eslint": "^7.2.1",
"babel-eslint": "^7.1.1", "browser-sync": "^2.18.8",
"eslint": "^3.17.1", "eslint": "^3.0.0",
"eslint-config-airbnb-es5": "^1.1.0", "eslint-config-airbnb-es5": "^1.1.0",
"eslint-config-defaults": "^9.0.0", "eslint-config-defaults": "^9.0.0",
"eslint-plugin-react": "^6.9.0", "eslint-plugin-react": "^6.10.3",
"grunt": "^1.0.1", "gulp": "github:gulpjs/gulp#4.0",
"grunt-browser-sync": "^2.2.0", "gulp-autoprefixer": "^3.1.1",
"grunt-cache-breaker": "^2.0.1", "gulp-cache-bust": "^1.1.0",
"grunt-contrib-clean": "^1.0.0", "gulp-environments": "^0.1.2",
"grunt-contrib-copy": "^1.0.0", "gulp-eslint": "^3.0.1",
"grunt-contrib-htmlmin": "^2.3.0", "gulp-htmlmin": "^3.0.0",
"grunt-contrib-requirejs": "^1.0.0", "gulp-inject": "^4.2.0",
"grunt-contrib-watch": "^1.0.0", "gulp-jsonminify": "^1.0.0",
"grunt-eslint": "^19.0.0", "gulp-kyh-inline-source": "^3.0.2",
"grunt-inline": "https://github.com/xf-/grunt-inline.git", "gulp-load-plugins": "^1.5.0",
"grunt-json-minify": "^1.1.0", "gulp-requirejs-optimize": "^1.2.0",
"grunt-postcss": "^0.8.0", "gulp-sass": "^3.1.0",
"grunt-sass": "^2.0.0", "gulp-sass-lint": "^1.3.2",
"grunt-sass-lint": "^0.2.2" "gulp-sourcemaps": "^2.4.1",
"gulp-uglify": "^2.1.2"
}, },
"eslintConfig": { "eslintConfig": {
"env": { "env": {

View File

@ -1,185 +0,0 @@
module.exports = function exports(grunt) {
'use strict';
grunt.config.merge({
nodedir: 'node_modules',
copy: {
html: {
src: ['*.html'],
expand: true,
cwd: 'html/',
dest: 'build/'
},
vendorjs: {
src: ['promise-polyfill/promise.js'],
expand: true,
cwd: '<%=nodedir%>/',
dest: 'build/vendor/'
},
config: {
src: ['config.json'],
expand: true,
cwd: '.',
dest: 'build/'
},
ionicons: {
src: ['fonts/*'],
expand: true,
dest: 'build/',
cwd: 'assets/icons/'
},
assistantFont: {
src: ['fonts/*'],
expand: true,
dest: 'build/',
cwd: 'assets/'
},
locale: {
src: ['locale/*'],
expand: true,
dest: 'build/',
cwd: '.'
}
},
sass: {
dev: {
options: {
sourceMap: true,
outputStyle: 'expanded'
},
files: [{
expand: true,
cwd: 'scss/',
src: '*.scss',
dest: 'build/',
ext: '.css'
}]
},
dist: {
options: {
outputStyle: 'compressed'
},
files: [{
expand: true,
cwd: 'scss/',
src: '*.scss',
dest: 'build/',
ext: '.css'
}]
}
},
postcss: {
options: {
processors: [
require('autoprefixer')({
browsers: ['> 1% in DE']
})
]
},
dev: {
options: {
map: true
},
dist: {
src: 'build/*.css'
}
},
dist: {
options: {
map: false
},
dist: {
src: 'build/*.css'
}
}
},
inline: {
dev: {
options: {
cssmin: true,
uglify: true
},
src: 'build/index.html',
dest: 'build/index.html'
},
dist: {
options: {
tag: '__build',
cssmin: true,
uglify: true
},
src: 'build/index.html',
dest: 'build/index.html'
}
},
htmlmin: {
dist: {
options: {
removeComments: true,
collapseWhitespace: true,
minifyJS: true
},
files: {
'build/index.html': 'build/index.html'
}
}
},
requirejs: {
default: {
options: {
baseUrl: 'lib',
name: '../<%=nodedir%>/almond/almond',
mainConfigFile: 'app.js',
include: '../app',
out: 'build/app.js',
build: true
}
},
dev: {
options: {
baseUrl: 'lib',
name: '../<%=nodedir%>/almond/almond',
mainConfigFile: 'app.js',
include: '../app',
optimize: 'none',
out: 'build/app.js',
build: false,
generateSourceMaps: true
}
}
},
'json-minify': {
build: {
files: 'build/locale/*.json'
}
},
cachebreaker: {
js: {
options: {
match: ['app.js']
},
files: {
src: ['build/index.html']
}
},
variable: {
options: {
match: ['vy*zx'],
position: 'overwrite'
},
files: {
src: ['build/config.json']
}
}
}
});
grunt.loadNpmTasks('grunt-contrib-copy');
grunt.loadNpmTasks('grunt-contrib-requirejs');
grunt.loadNpmTasks('grunt-sass');
grunt.loadNpmTasks('grunt-postcss');
grunt.loadNpmTasks('grunt-inline');
grunt.loadNpmTasks('grunt-contrib-htmlmin');
grunt.loadNpmTasks('grunt-json-minify');
grunt.loadNpmTasks('grunt-cache-breaker');
};

View File

@ -1,12 +0,0 @@
module.exports = function exports(grunt) {
'use strict';
grunt.config.merge({
clean: {
build: ['build/**/*', 'node_modules/grunt-newer/.cache'],
release: ['build/vendor', 'build/*.map', 'build/config.json', 'build/main.css']
}
});
grunt.loadNpmTasks('grunt-contrib-clean');
};

View File

@ -1,43 +0,0 @@
module.exports = function exports(grunt) {
'use strict';
grunt.config.merge({
'browserSync': {
dev: {
bsFiles: {
src: [
'build/*.css',
'build/*.js',
'build/*.html'
]
},
options: {
open: 'local',
watchTask: true,
injectChanges: true,
server: {
baseDir: 'build',
index: 'index.html'
}
}
}
},
watch: {
html: {
files: ['html/index.html', 'config.json', 'locale/*.json'],
tasks: ['copy', 'inline:dev', 'htmlmin', 'json-minify']
},
sass: {
files: ['scss/**/*.scss'],
tasks: ['sasslint', 'sass:dev', 'postcss:dev']
},
js: {
files: ['app.js', 'lib/**/*.js'],
tasks: ['eslint', 'requirejs:dev']
}
}
});
grunt.loadNpmTasks('grunt-browser-sync');
grunt.loadNpmTasks('grunt-contrib-watch');
};

View File

@ -1,28 +0,0 @@
module.exports = function exports(grunt) {
'use strict';
grunt.config.merge({
checkDependencies: {
options: {
install: true
}
},
sasslint: {
options: {
configFile: '.sass-lint.yml'
},
target: ['scss/main.scss', 'scss/night.scss', 'scss/*/*.scss']
},
eslint: {
sources: {
src: ['app.js', '!Gruntfile.js', 'lib/**/*.js', 'tasks/**/*.js']
},
grunt: {
src: ['Gruntfile.js', 'tasks/*.js']
}
}
});
grunt.loadNpmTasks('grunt-sass-lint');
grunt.loadNpmTasks('grunt-eslint');
};

2104
yarn.lock

File diff suppressed because it is too large Load Diff