richard
/
SemanSemantic-UItic-UI
mirror of https://github.com/Semantic-Org/Semantic-UI.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Fully embrace gulp 4 style

pull/6983/head
Jack 4 years ago
parent
2daacfa212
commit
6ad3892289
10 changed files with 1039 additions and 1047 deletions
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 5
      .browserlistrc
  2. 12
      gulpfile.js
  3. 1035
      package-lock.json
  4. 32
      package.json
  5. 54
      tasks/build.js
  6. 4
      tasks/build/assets.js
  7. 9
      tasks/config/tasks.js
  8. 654
      tasks/install.js
  9. 2
      tasks/version.js
  10. 279
      tasks/watch.js

5
.browserlistrc
View File

@ -0,0 +1,5 @@
last 2 versions
> 1%
opera 12.1
bb 10
android 4

12
gulpfile.js
View File

@ -2,7 +2,7 @@
Set-up Set-up
*******************************/ *******************************/
var
let
gulp = require('gulp'), gulp = require('gulp'),
// read user config to know what task to load // read user config to know what task to load
@ -36,7 +36,13 @@ var
/* Simple Compatibility with Gulp 3 */ /* Simple Compatibility with Gulp 3 */
gulp.start = function(name) { gulp.start = function(name) {
gulp.task(name)();
let task = gulp.task(name);
if(task) {
task();
}
else {
console.log('cant find', name);
}
} }
/******************************* /*******************************
@ -57,7 +63,7 @@ gulp.task('install', install);
gulp.task('check-install', checkInstall); gulp.task('check-install', checkInstall);
//gulp.task('default', ['check-install']);
gulp.task('default', checkInstall);
/*-------------- /*--------------
Docs Docs

1035
package-lock.json
File diff suppressed because it is too large
View File

32
package.json
View File

@ -1,6 +1,6 @@
{ {
"name": "semantic-ui", "name": "semantic-ui",
"version": "2.4.2",
"version": "2.5.0",
"title": "Semantic UI", "title": "Semantic UI",
"description": "Semantic empowers designers and developers by creating a shared vocabulary for UI.", "description": "Semantic empowers designers and developers by creating a shared vocabulary for UI.",
"homepage": "http://www.semantic-ui.com", "homepage": "http://www.semantic-ui.com",
@ -52,7 +52,7 @@
"del": "^3.0.0", "del": "^3.0.0",
"extend": "^3.0.2", "extend": "^3.0.2",
"gulp": "^4.0.2", "gulp": "^4.0.2",
"gulp-autoprefixer": "^6.0.0",
"gulp-autoprefixer": "^6.1.0",
"gulp-chmod": "^2.0.0", "gulp-chmod": "^2.0.0",
"gulp-clean-css": "^3.10.0", "gulp-clean-css": "^3.10.0",
"gulp-clone": "^2.0.1", "gulp-clone": "^2.0.1",
@ -61,35 +61,35 @@
"gulp-copy": "4.0.1", "gulp-copy": "4.0.1",
"gulp-dedupe": "0.0.2", "gulp-dedupe": "0.0.2",
"gulp-flatten": "^0.4.0", "gulp-flatten": "^0.4.0",
"gulp-header": "^2.0.5",
"gulp-header": "^2.0.9",
"gulp-if": "^2.0.2", "gulp-if": "^2.0.2",
"gulp-json-editor": "^2.5.2",
"gulp-json-editor": "^2.5.4",
"gulp-less": "^4.0.1", "gulp-less": "^4.0.1",
"gulp-notify": "^3.2.0", "gulp-notify": "^3.2.0",
"gulp-plumber": "^1.2.0",
"gulp-print": "^5.0.0",
"gulp-plumber": "^1.2.1",
"gulp-print": "^5.0.2",
"gulp-rename": "^1.4.0", "gulp-rename": "^1.4.0",
"gulp-replace": "^1.0.0", "gulp-replace": "^1.0.0",
"gulp-rtlcss": "^1.3.0",
"gulp-uglify": "^3.0.1",
"gulp4-run-sequence": "^0.4.0",
"jquery": "^3.4.1",
"gulp-rtlcss": "^1.4.1",
"gulp-uglify": "^3.0.2",
"gulp4-run-sequence": "^1.0.1",
"jquery": "^3.5.1",
"map-stream": "^0.1.0", "map-stream": "^0.1.0",
"merge-stream": "^1.0.0", "merge-stream": "^1.0.0",
"mkdirp": "^0.5.1",
"mkdirp": "^1.0.4",
"prompt-sui": "^3.2.1", "prompt-sui": "^3.2.1",
"replace-ext": "^1.0.0",
"replace-ext": "^1.0.1",
"require-dot-file": "^0.4.0", "require-dot-file": "^0.4.0",
"run-sequence": "^2.2.1", "run-sequence": "^2.2.1",
"wrench-sui": "^0.0.3", "wrench-sui": "^0.0.3",
"yamljs": "^0.3.0" "yamljs": "^0.3.0"
}, },
"devDependencies": { "devDependencies": {
"github": "*",
"github": "^14.0.0",
"gulp-concat-filenames": "*", "gulp-concat-filenames": "*",
"gulp-debug": "*",
"gulp-git": "*",
"gulp-tap": "*",
"gulp-debug": "^4.0.0",
"gulp-git": "^2.10.1",
"gulp-tap": "^2.0.0",
"merge-stream": "*" "merge-stream": "*"
}, },
"style": "dist/semantic.css" "style": "dist/semantic.css"

54
tasks/build.js
View File

@ -2,13 +2,20 @@
Build Task Build Task
*******************************/ *******************************/
var
let
// dependencies // dependencies
gulp = require('gulp'),
gulp = require('gulp'),
// config // config
config = require('./config/user'),
install = require('./config/project/install'),
config = require('./config/user'),
install = require('./config/project/install'),
buildJS = require('./build/javascript'),
buildCSS = require('./build/css'),
buildAssets = require('./build/assets'),
// rtl
buildRTL = require('./rtl/build'),
// task sequence // task sequence
tasks = [], tasks = [],
@ -19,38 +26,19 @@ var
; ;
build = function(callback) {
console.info('Building Semantic');
if( !install.isSetup() ) {
console.error('Cannot find semantic.json. Run "gulp install" to set-up Semantic');
return 1;
}
// check for right-to-left (RTL) language
if(config.rtl === true || config.rtl === 'Yes') {
gulp.start('build-rtl');
return;
}
if(config.rtl == 'both') {
tasks.push('build-rtl');
}
if(config.rtl == 'both') {
tasks.push(buildRTL);
}
tasks.push('build-javascript');
tasks.push('build-css');
tasks.push('build-assets');
tasks.push(buildJS);
tasks.push(buildCSS);
tasks.push(buildAssets);
tasks = tasks.map(task => {
gulp.task(task)(callback);
return (taskDone) => {
taskDone();
};
});
if(config.rtl === true || config.rtl === 'Yes') {
tasks.push(buildRTL);
}
series(parallel(tasks), callback);
};
build = parallel(tasks);
/* Export with Metadata */ /* Export with Metadata */

4
tasks/build/assets.js
View File

@ -37,6 +37,6 @@ buildAssets = function(callback) {
}; };
/* Export with Metadata */ /* Export with Metadata */
buildAssets.displayName = 'build-css';
buildAssets.description = 'Builds all css from source';
buildAssets.displayName = 'build-assets';
buildAssets.description = 'Builds all assets';
module.exports = buildAssets; module.exports = buildAssets;

9
tasks/config/tasks.js
View File

@ -115,15 +115,8 @@ module.exports = {
} }
}, },
/* What Browsers to Prefix */
/* Autoprefix settings */
prefix: { prefix: {
browsers: [
'last 2 versions',
'> 1%',
'opera 12.1',
'bb 10',
'android 4'
]
}, },
/* File Renames */ /* File Renames */

654
tasks/install.js
View File

@ -14,7 +14,7 @@
*/ */
var
let
gulp = require('gulp'), gulp = require('gulp'),
// node dependencies // node dependencies
console = require('better-console'), console = require('better-console'),
@ -53,413 +53,411 @@ var
settings = install.settings, settings = install.settings,
source = install.source, source = install.source,
install
installer
; ;
installer = function (callback) { installer = function (callback) {
var
currentConfig = requireDotFile('semantic.json'),
manager = install.getPackageManager(),
rootQuestions = questions.root,
installFolder = false,
answers
;
console.clear();
/* Test NPM install
manager = {
name : 'NPM',
root : path.normalize(__dirname + '/../')
};
*/
/* Don't do end user config if SUI is a sub-module */
if( install.isSubModule() ) {
console.info('SUI is a sub-module, skipping end-user install');
return;
}
/*-----------------
Update SUI
-----------------*/
// run update scripts if semantic.json exists
if(currentConfig && manager.name === 'NPM') {
var
updateFolder = path.join(manager.root, currentConfig.base),
updatePaths = {
config : path.join(manager.root, files.config),
tasks : path.join(updateFolder, folders.tasks),
themeImport : path.join(updateFolder, folders.themeImport),
definition : path.join(currentConfig.paths.source.definitions),
site : path.join(currentConfig.paths.source.site),
theme : path.join(currentConfig.paths.source.themes),
defaultTheme : path.join(currentConfig.paths.source.themes, folders.defaultTheme)
}
let
currentConfig = requireDotFile('semantic.json'),
manager = install.getPackageManager(),
rootQuestions = questions.root,
installFolder = false,
answers
; ;
// duck-type if there is a project installed
if( fs.existsSync(updatePaths.definition) ) {
// perform update if new version
if(currentConfig.version !== release.version) {
console.log('Updating Semantic UI from ' + currentConfig.version + ' to ' + release.version);
console.info('Updating ui definitions...');
wrench.copyDirSyncRecursive(source.definitions, updatePaths.definition, settings.wrench.overwrite);
console.info('Updating default theme...');
wrench.copyDirSyncRecursive(source.themes, updatePaths.theme, settings.wrench.merge);
wrench.copyDirSyncRecursive(source.defaultTheme, updatePaths.defaultTheme, settings.wrench.overwrite);
console.clear();
console.info('Updating tasks...');
wrench.copyDirSyncRecursive(source.tasks, updatePaths.tasks, settings.wrench.overwrite);
/* Test NPM install
manager = {
name : 'NPM',
root : path.normalize(__dirname + '/../')
};
*/
console.info('Updating gulpfile.js');
gulp.src(source.userGulpFile)
.pipe(plumber())
.pipe(gulp.dest(updateFolder))
;
// copy theme import
console.info('Updating theme import file');
gulp.src(source.themeImport)
.pipe(plumber())
.pipe(gulp.dest(updatePaths.themeImport))
;
/* Don't do end user config if SUI is a sub-module */
if( install.isSubModule() ) {
console.info('SUI is a sub-module, skipping end-user install');
return;
}
console.info('Adding new site theme files...');
wrench.copyDirSyncRecursive(source.site, updatePaths.site, settings.wrench.merge);
/*-----------------
Update SUI
-----------------*/
// run update scripts if semantic.json exists
if(currentConfig && manager.name === 'NPM') {
let
updateFolder = path.join(manager.root, currentConfig.base),
updatePaths = {
config : path.join(manager.root, files.config),
tasks : path.join(updateFolder, folders.tasks),
themeImport : path.join(updateFolder, folders.themeImport),
definition : path.join(currentConfig.paths.source.definitions),
site : path.join(currentConfig.paths.source.site),
theme : path.join(currentConfig.paths.source.themes),
defaultTheme : path.join(currentConfig.paths.source.themes, folders.defaultTheme)
}
;
console.info('Updating version...');
// duck-type if there is a project installed
if( fs.existsSync(updatePaths.definition) ) {
// update version number in semantic.json
gulp.src(updatePaths.config)
.pipe(plumber())
.pipe(rename(settings.rename.json)) // preserve file extension
.pipe(jsonEditor({
version: release.version
}))
.pipe(gulp.dest(manager.root))
;
// perform update if new version
if(currentConfig.version !== release.version) {
console.log('Updating Semantic UI from ' + currentConfig.version + ' to ' + release.version);
console.info('Update complete! Run "\x1b[92mgulp build\x1b[0m" to rebuild dist/ files.');
console.info('Updating ui definitions...');
wrench.copyDirSyncRecursive(source.definitions, updatePaths.definition, settings.wrench.overwrite);
return;
}
else {
console.log('Current version of Semantic UI already installed');
return;
}
console.info('Updating default theme...');
wrench.copyDirSyncRecursive(source.themes, updatePaths.theme, settings.wrench.merge);
wrench.copyDirSyncRecursive(source.defaultTheme, updatePaths.defaultTheme, settings.wrench.overwrite);
}
else {
console.error('Cannot locate files to update at path: ', updatePaths.definition);
console.log('Running installer');
}
console.info('Updating tasks...');
wrench.copyDirSyncRecursive(source.tasks, updatePaths.tasks, settings.wrench.overwrite);
}
console.info('Updating gulpfile.js');
gulp.src(source.userGulpFile)
.pipe(plumber())
.pipe(gulp.dest(updateFolder))
;
/*--------------
Determine Root
---------------*/
// copy theme import
console.info('Updating theme import file');
gulp.src(source.themeImport)
.pipe(plumber())
.pipe(gulp.dest(updatePaths.themeImport))
;
// PM that supports Build Tools (NPM Only Now)
if(manager.name == 'NPM') {
rootQuestions[0].message = rootQuestions[0].message
.replace('{packageMessage}', 'We detected you are using ' + manager.name + ' Nice!')
.replace('{root}', manager.root)
;
// set default path to detected PM root
rootQuestions[0].default = manager.root;
rootQuestions[1].default = manager.root;
console.info('Adding new site theme files...');
wrench.copyDirSyncRecursive(source.site, updatePaths.site, settings.wrench.merge);
// insert PM questions after "Install Type" question
Array.prototype.splice.apply(questions.setup, [2, 0].concat(rootQuestions));
console.info('Updating version...');
// omit cleanup questions for managed install
questions.cleanup = [];
}
// update version number in semantic.json
gulp.src(updatePaths.config)
.pipe(plumber())
.pipe(rename(settings.rename.json)) // preserve file extension
.pipe(jsonEditor({
version: release.version
}))
.pipe(gulp.dest(manager.root))
;
console.info('Update complete! Run "\x1b[92mgulp build\x1b[0m" to rebuild dist/ files.');
/*--------------
Create SUI
---------------*/
return;
}
else {
console.log('Current version of Semantic UI already installed');
return;
}
gulp.task('run setup', function() {
}
else {
console.error('Cannot locate files to update at path: ', updatePaths.definition);
console.log('Running installer');
}
// If auto-install is switched on, we skip the configuration section and simply reuse the configuration from semantic.json
if(install.shouldAutoInstall()) {
answers = {
overwrite : 'yes',
install : 'auto',
useRoot : true,
semanticRoot : currentConfig.base
};
}
else {
return gulp
.src('gulpfile.js')
.pipe(prompt.prompt(questions.setup, function(setupAnswers) {
// hoist
answers = setupAnswers;
}))
;
} }
});
gulp.task('create install files', function(callback) {
/*-------------- /*--------------
Exit Conditions
Determine Root
---------------*/ ---------------*/
// if config exists and user specifies not to proceed
if(answers.overwrite !== undefined && answers.overwrite == 'no') {
return;
}
console.clear();
if(install.shouldAutoInstall()) {
console.log('Auto-Installing (Without User Interaction)');
}
else {
console.log('Installing');
}
console.log('------------------------------');
// PM that supports Build Tools (NPM Only Now)
if(manager.name == 'NPM') {
rootQuestions[0].message = rootQuestions[0].message
.replace('{packageMessage}', 'We detected you are using ' + manager.name + ' Nice!')
.replace('{root}', manager.root)
;
// set default path to detected PM root
rootQuestions[0].default = manager.root;
rootQuestions[1].default = manager.root;
// insert PM questions after "Install Type" question
Array.prototype.splice.apply(questions.setup, [2, 0].concat(rootQuestions));
/*--------------
Paths
---------------*/
// omit cleanup questions for managed install
questions.cleanup = [];
}
var
installPaths = {
config : files.config,
configFolder : folders.config,
site : answers.site || folders.site,
themeConfig : files.themeConfig,
themeConfigFolder : folders.themeConfig
}
;
/*-------------- /*--------------
NPM Install
Create SUI
---------------*/ ---------------*/
// Check if PM install
if(manager && (answers.useRoot || answers.customRoot)) {
gulp.task('run setup', function() {
// Set root to custom root path if set
if(answers.customRoot) {
if(answers.customRoot === '') {
console.log('Unable to proceed, invalid project root');
return;
}
manager.root = answers.customRoot;
// If auto-install is switched on, we skip the configuration section and simply reuse the configuration from semantic.json
if(install.shouldAutoInstall()) {
answers = {
overwrite : 'yes',
install : 'auto',
useRoot : true,
semanticRoot : currentConfig.base
};
} }
else {
return gulp
.src('gulpfile.js')
.pipe(prompt.prompt(questions.setup, function(setupAnswers) {
// hoist
answers = setupAnswers;
}))
;
}
});
// special install paths only for PM install
installPaths = extend(false, {}, installPaths, {
definition : folders.definitions,
lessImport : folders.lessImport,
tasks : folders.tasks,
theme : folders.themes,
defaultTheme : path.join(folders.themes, folders.defaultTheme),
themeImport : folders.themeImport
});
gulp.task('create install files', function(callback) {
// add project root to semantic root
installFolder = path.join(manager.root, answers.semanticRoot);
/*--------------
Exit Conditions
---------------*/
// add install folder to all output paths
for(var destination in installPaths) {
if( installPaths.hasOwnProperty(destination) ) {
// config goes in project root, rest in install folder
installPaths[destination] = (destination == 'config' || destination == 'configFolder')
? path.normalize( path.join(manager.root, installPaths[destination]) )
: path.normalize( path.join(installFolder, installPaths[destination]) )
;
}
// if config exists and user specifies not to proceed
if(answers.overwrite !== undefined && answers.overwrite == 'no') {
return;
} }
// create project folders
try {
mkdirp.sync(installFolder);
mkdirp.sync(installPaths.definition);
mkdirp.sync(installPaths.theme);
mkdirp.sync(installPaths.tasks);
console.clear();
if(install.shouldAutoInstall()) {
console.log('Auto-Installing (Without User Interaction)');
} }
catch(error) {
console.error('NPM does not have permissions to create folders at your specified path. Adjust your folders permissions and run "npm install" again');
else {
console.log('Installing');
} }
console.log('------------------------------');
console.log('Installing to \x1b[92m' + answers.semanticRoot + '\x1b[0m');
console.info('Copying UI definitions');
wrench.copyDirSyncRecursive(source.definitions, installPaths.definition, settings.wrench.overwrite);
/*--------------
Paths
---------------*/
console.info('Copying UI themes');
wrench.copyDirSyncRecursive(source.themes, installPaths.theme, settings.wrench.merge);
wrench.copyDirSyncRecursive(source.defaultTheme, installPaths.defaultTheme, settings.wrench.overwrite);
console.info('Copying gulp tasks');
wrench.copyDirSyncRecursive(source.tasks, installPaths.tasks, settings.wrench.overwrite);
// copy theme import
console.info('Adding theme files');
gulp.src(source.themeImport)
.pipe(plumber())
.pipe(gulp.dest(installPaths.themeImport))
;
gulp.src(source.lessImport)
.pipe(plumber())
.pipe(gulp.dest(installPaths.lessImport))
let
installPaths = {
config : files.config,
configFolder : folders.config,
site : answers.site || folders.site,
themeConfig : files.themeConfig,
themeConfigFolder : folders.themeConfig
}
; ;
// create gulp file
console.info('Creating gulpfile.js');
gulp.src(source.userGulpFile)
.pipe(plumber())
.pipe(gulp.dest(installFolder))
;
/*--------------
NPM Install
---------------*/
callback();
// Check if PM install
if(manager && (answers.useRoot || answers.customRoot)) {
}
// Set root to custom root path if set
if(answers.customRoot) {
if(answers.customRoot === '') {
console.log('Unable to proceed, invalid project root');
return;
}
manager.root = answers.customRoot;
}
// special install paths only for PM install
installPaths = extend(false, {}, installPaths, {
definition : folders.definitions,
lessImport : folders.lessImport,
tasks : folders.tasks,
theme : folders.themes,
defaultTheme : path.join(folders.themes, folders.defaultTheme),
themeImport : folders.themeImport
});
// add project root to semantic root
installFolder = path.join(manager.root, answers.semanticRoot);
// add install folder to all output paths
for(let destination in installPaths) {
if( installPaths.hasOwnProperty(destination) ) {
// config goes in project root, rest in install folder
installPaths[destination] = (destination == 'config' || destination == 'configFolder')
? path.normalize( path.join(manager.root, installPaths[destination]) )
: path.normalize( path.join(installFolder, installPaths[destination]) )
;
}
}
/*--------------
Site Theme
---------------*/
// create project folders
try {
mkdirp.sync(installFolder);
mkdirp.sync(installPaths.definition);
mkdirp.sync(installPaths.theme);
mkdirp.sync(installPaths.tasks);
}
catch(error) {
console.error('NPM does not have permissions to create folders at your specified path. Adjust your folders permissions and run "npm install" again');
}
// Copy _site templates folder to destination
if( fs.existsSync(installPaths.site) ) {
console.info('Site folder exists, merging files (no overwrite)', installPaths.site);
}
else {
console.info('Creating site theme folder', installPaths.site);
}
wrench.copyDirSyncRecursive(source.site, installPaths.site, settings.wrench.merge);
console.log('Installing to \x1b[92m' + answers.semanticRoot + '\x1b[0m');
/*--------------
Theme Config
---------------*/
console.info('Copying UI definitions');
wrench.copyDirSyncRecursive(source.definitions, installPaths.definition, settings.wrench.overwrite);
gulp.task('create theme.config', function() {
var
// determine path to site theme folder from theme config
// force CSS path variable to use forward slashes for paths
pathToSite = path.relative(path.resolve(installPaths.themeConfigFolder), path.resolve(installPaths.site)).replace(/\\/g,'/'),
siteVariable = "@siteFolder : '" + pathToSite + "/';"
;
console.info('Copying UI themes');
wrench.copyDirSyncRecursive(source.themes, installPaths.theme, settings.wrench.merge);
wrench.copyDirSyncRecursive(source.defaultTheme, installPaths.defaultTheme, settings.wrench.overwrite);
// rewrite site variable in theme.less
console.info('Adjusting @siteFolder to: ', pathToSite + '/');
console.info('Copying gulp tasks');
wrench.copyDirSyncRecursive(source.tasks, installPaths.tasks, settings.wrench.overwrite);
if(fs.existsSync(installPaths.themeConfig)) {
console.info('Modifying src/theme.config (LESS config)', installPaths.themeConfig);
return gulp.src(installPaths.themeConfig)
// copy theme import
console.info('Adding theme files');
gulp.src(source.themeImport)
.pipe(plumber()) .pipe(plumber())
.pipe(replace(regExp.siteVariable, siteVariable))
.pipe(gulp.dest(installPaths.themeConfigFolder))
.pipe(gulp.dest(installPaths.themeImport))
; ;
}
else {
console.info('Creating src/theme.config (LESS config)', installPaths.themeConfig);
return gulp.src(source.themeConfig)
gulp.src(source.lessImport)
.pipe(plumber()) .pipe(plumber())
.pipe(rename({ extname : '' }))
.pipe(replace(regExp.siteVariable, siteVariable))
.pipe(gulp.dest(installPaths.themeConfigFolder))
.pipe(gulp.dest(installPaths.lessImport))
; ;
}
});
/*--------------
Semantic.json
---------------*/
// create gulp file
console.info('Creating gulpfile.js');
gulp.src(source.userGulpFile)
.pipe(plumber())
.pipe(gulp.dest(installFolder))
;
gulp.task('create semantic.json', function() {
callback();
var
jsonConfig = install.createJSON(answers)
;
}
// adjust variables in theme.less
if( fs.existsSync(installPaths.config) ) {
console.info('Extending config file (semantic.json)', installPaths.config);
return gulp.src(installPaths.config)
.pipe(plumber())
.pipe(rename(settings.rename.json)) // preserve file extension
.pipe(jsonEditor(jsonConfig))
.pipe(gulp.dest(installPaths.configFolder))
;
/*--------------
Site Theme
---------------*/
// Copy _site templates folder to destination
if( fs.existsSync(installPaths.site) ) {
console.info('Site folder exists, merging files (no overwrite)', installPaths.site);
} }
else { else {
console.info('Creating config file (semantic.json)', installPaths.config);
return gulp.src(source.config)
.pipe(plumber())
.pipe(rename({ extname : '' })) // remove .template from ext
.pipe(jsonEditor(jsonConfig))
.pipe(gulp.dest(installPaths.configFolder))
;
console.info('Creating site theme folder', installPaths.site);
} }
wrench.copyDirSyncRecursive(source.site, installPaths.site, settings.wrench.merge);
/*--------------
Theme Config
---------------*/
gulp.task('create theme.config', function() {
let
// determine path to site theme folder from theme config
// force CSS path variable to use forward slashes for paths
pathToSite = path.relative(path.resolve(installPaths.themeConfigFolder), path.resolve(installPaths.site)).replace(/\\/g,'/'),
siteVariable = "@siteFolder : '" + pathToSite + "/';"
;
});
// rewrite site variable in theme.less
console.info('Adjusting @siteFolder to: ', pathToSite + '/');
runSequence(
'create theme.config',
'create semantic.json',
callback
);
if(fs.existsSync(installPaths.themeConfig)) {
console.info('Modifying src/theme.config (LESS config)', installPaths.themeConfig);
return gulp.src(installPaths.themeConfig)
.pipe(plumber())
.pipe(replace(regExp.siteVariable, siteVariable))
.pipe(gulp.dest(installPaths.themeConfigFolder))
;
}
else {
console.info('Creating src/theme.config (LESS config)', installPaths.themeConfig);
return gulp.src(source.themeConfig)
.pipe(plumber())
.pipe(rename({ extname : '' }))
.pipe(replace(regExp.siteVariable, siteVariable))
.pipe(gulp.dest(installPaths.themeConfigFolder))
;
}
});
});
/*--------------
Semantic.json
---------------*/
gulp.task('clean up install', function() {
gulp.task('create semantic.json', function() {
// Completion Message
if(installFolder && !install.shouldAutoInstall()) {
console.log('\n Setup Complete! \n Installing Peer Dependencies. \x1b[0;31mPlease refrain from ctrl + c\x1b[0m... \n After completion navigate to \x1b[92m' + answers.semanticRoot + '\x1b[0m and run "\x1b[92mgulp build\x1b[0m" to build');
process.exit(0);
}
else {
console.log('');
console.log('');
}
let
jsonConfig = install.createJSON(answers)
;
// If auto-install is switched on, we skip the configuration section and simply build the dependencies
if(install.shouldAutoInstall()) {
return gulp.start('build');
}
else {
return gulp
.src('gulpfile.js')
.pipe(prompt.prompt(questions.cleanup, function(answers) {
if(answers.cleanup == 'yes') {
del(install.setupFiles);
}
if(answers.build == 'yes') {
gulp.start('build');
}
}))
;
}
// adjust variables in theme.less
if( fs.existsSync(installPaths.config) ) {
console.info('Extending config file (semantic.json)', installPaths.config);
return gulp.src(installPaths.config)
.pipe(plumber())
.pipe(rename(settings.rename.json)) // preserve file extension
.pipe(jsonEditor(jsonConfig))
.pipe(gulp.dest(installPaths.configFolder))
;
}
else {
console.info('Creating config file (semantic.json)', installPaths.config);
return gulp.src(source.config)
.pipe(plumber())
.pipe(rename({ extname : '' })) // remove .template from ext
.pipe(jsonEditor(jsonConfig))
.pipe(gulp.dest(installPaths.configFolder))
;
}
});
runSequence(
'create theme.config',
'create semantic.json',
callback
);
});
gulp.task('clean up install', function() {
// Completion Message
if(installFolder && !install.shouldAutoInstall()) {
console.log('\n Setup Complete! \n Installing Peer Dependencies. \x1b[0;31mPlease refrain from ctrl + c\x1b[0m... \n After completion navigate to \x1b[92m' + answers.semanticRoot + '\x1b[0m and run "\x1b[92mgulp build\x1b[0m" to build');
process.exit(0);
}
else {
console.log('');
console.log('');
}
});
// If auto-install is switched on, we skip the configuration section and simply build the dependencies
if(install.shouldAutoInstall()) {
return gulp.start('build');
}
else {
return gulp
.src('gulpfile.js')
.pipe(prompt.prompt(questions.cleanup, function(answers) {
if(answers.cleanup == 'yes') {
del(install.setupFiles);
}
if(answers.build == 'yes') {
gulp.start('build');
}
}))
;
}
});
runSequence(
'run setup',
'create install files',
'clean up install',
callback
);
runSequence(
'run setup',
'create install files',
'clean up install',
callback
);
}; };

2
tasks/version.js
View File

@ -2,7 +2,7 @@
Version Task Version Task
*******************************/ *******************************/
var
let
release = require('./config/project/release'), release = require('./config/project/release'),
version version
; ;

279
tasks/watch.js
View File

@ -2,7 +2,7 @@
Watch Task Watch Task
*******************************/ *******************************/
var
let
gulp = require('gulp'), gulp = require('gulp'),
// node dependencies // node dependencies
@ -41,7 +41,16 @@ var
log = tasks.log, log = tasks.log,
settings = tasks.settings, settings = tasks.settings,
watch
watch,
// individual watch tasks
watchCSS,
watchJS,
watchAssets,
watchCSSCallback,
watchJSCallback,
watchAssetsCallback
; ;
@ -76,139 +85,152 @@ watch = function(callback) {
Watch CSS Watch CSS
---------------*/ ---------------*/
gulp
watchCSS = gulp
.watch([ .watch([
source.config, source.config,
source.definitions + '/**/*.less', source.definitions + '/**/*.less',
source.site + '/**/*.{overrides,variables}', source.site + '/**/*.{overrides,variables}',
source.themes + '/**/*.{overrides,variables}' source.themes + '/**/*.{overrides,variables}'
], function(file) {
var
lessPath,
])
;
watchCSSCallback = (filePath) => {
let
lessPath,
stream,
compressedStream,
uncompressedStream,
isDefinition,
isPackagedTheme,
isSiteTheme,
isConfig
;
// log modified file
gulp.src(filePath)
.pipe(print(log.modified))
;
/*--------------
Find Source
---------------*/
// recompile on *.override , *.variable change
isConfig = (filePath.indexOf('theme.config') !== -1 || filePath.indexOf('site.variables') !== -1);
isPackagedTheme = (filePath.indexOf(source.themes) !== -1);
isSiteTheme = (filePath.indexOf(source.site) !== -1);
isDefinition = (filePath.indexOf(source.definitions) !== -1);
if(isConfig) {
console.info('Rebuilding all UI');
// impossible to tell which file was updated in theme.config, rebuild all
gulp.start('build-css');
return;
}
else if(isPackagedTheme) {
console.log('Change detected in packaged theme');
lessPath = replaceExt(filePath, '.less');
lessPath = lessPath.replace(tasks.regExp.theme, source.definitions);
}
else if(isSiteTheme) {
console.log('Change detected in site theme');
lessPath = replaceExt(filePath, '.less');
lessPath = lessPath.replace(source.site, source.definitions);
}
else {
console.log('Change detected in definition');
lessPath = filePath;
}
/*--------------
Create CSS
---------------*/
if( fs.existsSync(lessPath) ) {
// unified css stream
stream = gulp.src(lessPath)
.pipe(plumber(settings.plumber.less))
.pipe(less(settings.less))
.pipe(print(log.created))
.pipe(replace(comments.variables.in, comments.variables.out))
.pipe(replace(comments.license.in, comments.license.out))
.pipe(replace(comments.large.in, comments.large.out))
.pipe(replace(comments.small.in, comments.small.out))
.pipe(replace(comments.tiny.in, comments.tiny.out))
.pipe(autoprefixer(settings.prefix))
.pipe(gulpif(config.hasPermission, chmod(config.permission)))
;
stream,
compressedStream,
uncompressedStream,
// use 2 concurrent streams from same pipe
uncompressedStream = stream.pipe(clone());
compressedStream = stream.pipe(clone());
isDefinition,
isPackagedTheme,
isSiteTheme,
isConfig
uncompressedStream
.pipe(plumber())
.pipe(replace(assets.source, assets.uncompressed))
.pipe(gulp.dest(output.uncompressed))
.pipe(print(log.created))
.on('end', function() {
gulp.start('package uncompressed css');
})
; ;
// log modified file
gulp.src(file.path)
.pipe(print(log.modified))
compressedStream
.pipe(plumber())
.pipe(replace(assets.source, assets.compressed))
.pipe(minifyCSS(settings.minify))
.pipe(rename(settings.rename.minCSS))
.pipe(gulp.dest(output.compressed))
.pipe(print(log.created))
.on('end', function() {
gulp.start('package compressed css');
})
; ;
/*--------------
Find Source
---------------*/
// recompile on *.override , *.variable change
isConfig = (file.path.indexOf('theme.config') !== -1 || file.path.indexOf('site.variables') !== -1);
isPackagedTheme = (file.path.indexOf(source.themes) !== -1);
isSiteTheme = (file.path.indexOf(source.site) !== -1);
isDefinition = (file.path.indexOf(source.definitions) !== -1);
if(isConfig) {
console.info('Rebuilding all UI');
// impossible to tell which file was updated in theme.config, rebuild all
gulp.start('build-css');
return;
}
else if(isPackagedTheme) {
console.log('Change detected in packaged theme');
lessPath = replaceExt(file.path, '.less');
lessPath = lessPath.replace(tasks.regExp.theme, source.definitions);
}
else if(isSiteTheme) {
console.log('Change detected in site theme');
lessPath = replaceExt(file.path, '.less');
lessPath = lessPath.replace(source.site, source.definitions);
}
else {
console.log('Change detected in definition');
lessPath = file.path;
}
/*--------------
Create CSS
---------------*/
if( fs.existsSync(lessPath) ) {
// unified css stream
stream = gulp.src(lessPath)
.pipe(plumber(settings.plumber.less))
.pipe(less(settings.less))
.pipe(print(log.created))
.pipe(replace(comments.variables.in, comments.variables.out))
.pipe(replace(comments.license.in, comments.license.out))
.pipe(replace(comments.large.in, comments.large.out))
.pipe(replace(comments.small.in, comments.small.out))
.pipe(replace(comments.tiny.in, comments.tiny.out))
.pipe(autoprefixer(settings.prefix))
.pipe(gulpif(config.hasPermission, chmod(config.permission)))
;
// use 2 concurrent streams from same pipe
uncompressedStream = stream.pipe(clone());
compressedStream = stream.pipe(clone());
uncompressedStream
.pipe(plumber())
.pipe(replace(assets.source, assets.uncompressed))
.pipe(gulp.dest(output.uncompressed))
.pipe(print(log.created))
.on('end', function() {
gulp.start('package uncompressed css');
})
;
compressedStream
.pipe(plumber())
.pipe(replace(assets.source, assets.compressed))
.pipe(minifyCSS(settings.minify))
.pipe(rename(settings.rename.minCSS))
.pipe(gulp.dest(output.compressed))
.pipe(print(log.created))
.on('end', function() {
gulp.start('package compressed css');
})
;
}
else {
console.log('Cannot find UI definition at path', lessPath);
}
})
}
else {
console.log('Cannot find UI definition at path', lessPath);
}
};
// these are separate handlers in gulp 4
watchCSS
.on('change', watchCSSCallback)
.on('add', watchCSSCallback)
; ;
/*-------------- /*--------------
Watch JS Watch JS
---------------*/ ---------------*/
gulp
watchJS = gulp
.watch([ .watch([
source.definitions + '/**/*.js' source.definitions + '/**/*.js'
], function(file) {
gulp.src(file.path)
.pipe(plumber())
.pipe(replace(comments.license.in, comments.license.out))
.pipe(gulpif(config.hasPermission, chmod(config.permission)))
.pipe(gulp.dest(output.uncompressed))
.pipe(print(log.created))
.pipe(uglify(settings.uglify))
.pipe(rename(settings.rename.minJS))
.pipe(gulp.dest(output.compressed))
.pipe(print(log.created))
.on('end', function() {
gulp.start('package compressed js');
gulp.start('package uncompressed js');
})
;
})
])
;
watchJSCallback = (filePath) => {
gulp.src(filePath)
.pipe(plumber())
.pipe(replace(comments.license.in, comments.license.out))
.pipe(gulpif(config.hasPermission, chmod(config.permission)))
.pipe(gulp.dest(output.uncompressed))
.pipe(print(log.created))
.pipe(uglify(settings.uglify))
.pipe(rename(settings.rename.minJS))
.pipe(gulp.dest(output.compressed))
.pipe(print(log.created))
.on('end', function() {
gulp.start('package compressed js');
gulp.start('package uncompressed js');
})
;
};
watchJS
.on('change', watchJSCallback)
.on('add', watchJSCallback)
; ;
/*-------------- /*--------------
@ -216,17 +238,22 @@ watch = function(callback) {
---------------*/ ---------------*/
// only copy assets that match component names (or their plural) // only copy assets that match component names (or their plural)
gulp
watchAssets = gulp
.watch([ .watch([
source.themes + '/**/assets/**/*.*' source.themes + '/**/assets/**/*.*'
], function(file) {
// copy assets
gulp.src(file.path, { base: source.themes })
.pipe(gulpif(config.hasPermission, chmod(config.permission)))
.pipe(gulp.dest(output.themes))
.pipe(print(log.created))
;
})
])
;
watchAssetsCallback = (filePath) => {
// copy assets
gulp.src(filePath, { base: source.themes })
.pipe(gulpif(config.hasPermission, chmod(config.permission)))
.pipe(gulp.dest(output.themes))
.pipe(print(log.created))
;
};
watchAssets
.on('change', watchAssetsCallback)
.on('add', watchAssetsCallback)
; ;
}; };

Write Preview
Loading…
Cancel
Save