That's a set of configs and scripts built on top of gulp
and webpack
that help us deliver the awesome
Blocksy theme.
Example gulpfile.js
const gulp = require('gulp')
const buildProcess = require('ct-build-process')
const data = require('./package.json')
var options = {
entries: [
{
entry: './static/js/main.js',
output: {
path: './static/bundle/',
},
},
],
sassFiles: [
{
input: 'static/sass/style.scss',
output: 'static/bundle',
header: buildProcess.headerFor(false, data),
},
],
browserSyncEnabled: true,
sassWatch: ['assets/*/sass/**/*.scss'],
toClean: ['static/bundle/'],
}
buildProcess.registerTasks(gulp, options)
We wanted a clean way of building assets in a consistent manner across many repositories. That's the best thing we were able to come up with.
npm install --save-dev ct-build-process
Then build your own gulpfile.js
on top of our module. Read the code if you
need more details about the various config flags we have here.
Every task here respects NODE_ENV=production
in its own way. Minification,
source maps, watching - all of this is present just in development.
There are two types of packages:
wordpress_theme
unyson_extension
gulp webpack
- one time build. Doesn't watch if you setNODE_ENV=production
gulp sass
- one time buildgulp sass:watch
-gulp sass
with watcher
Some tasks that will look at your package type and replace the current version with the bumped one. Very convenient.
wordpress_theme
- will look in:bower.json
,package.json
,style.css
unyson_extension
- will look inpackage.json
andmanifest.php
gulp bump:major
gulp bump:minor
gulp bump:patch
orgulp bump
Uses node-semver
.
There are some specific tasks for creating and publishing new releases of
WordPress themes and Unyson extensions. This tasks will respect options.packageType
option.
The build:create_release
tasks depends strongly on github-release
package. You should go ahead and install it and make it available in your $PATH
variable, otherwise you won't be able to benefit from this task. Also,
GITHUB_TOKEN
should be exported by your shell login script (like bashrc
or zshrc
).
export GITHUB_TOKEN=YOUR_GITHUB_TOKEN
-
gulp build:remove_tmp
- will removebuild_tmp
directory in your package -
gulp build:copy_files
- will copy files to your build dir, with respect of your .gitignore. -
gulp build:delete_files_from_build
- deleteoptions.filesToDeleteFromBuild
-
gulp build:prepare_production_zip
-
gulp build
- a combination of the four above -
gulp build:create_release
-
gulp build:publish
- a combination ofbuild
andbuild:create_release
gulp clean
- will clean all the files. Respectsoptions.toClean
alsogulp build
-gulp clean; gulp webpack; gulp sass
gulp dev
-gulp build; gulp sass:watch
NODE_ENV=production gulp build
- reliable way of building assets for productionNODE_ENV_GETTEXT=true gulp build
- build & extract I18N strings
gulp build:strip_code
- Will stripe code that's between a pair of comments matched by regex. You have to specify a list of files to look into. Comments and list of files is configurable.
-
packageType
- unyson_extension | wordpress_theme -
currentVersion
- current package version used bygulp bump
-
entries
- Multiple entries for webpack-multi-compiler. They have some syntactic sugar like -
webpackIncludePaths
-
webpackExternals
-
webpackResolveAliases
-
webpackPlugins
-
webpackAdditionalModules
-
sassFiles
- array of objects that specify input and output for sass compiler -
sassIncludePaths
-
browserSyncEnabled
-
browserSyncInitOptions
-
watchFilesAndReload
- list of files for browser sync - will cause browser to reload when any of them is changed at the fs level -
toClean
- list of files forgulp clean
-
stripCodeStartComment
-
stripCodeEndComment
-
filesToStripCodeFrom
-gulp build:strip_code
stuff
MIT