kubozer

:warning: Deprecated

---

The best tool for Contactlab projects builds :rocket:

Kubozer is a wrapper of some tools for building production (and development) application written in Polymer 1.x. and ESnext syntax.

Features

• Copy whatever files you need into your build directory
• Replace part of the html files where needed (like change the link within the index.html to your production-ready script) with replace-in-file
• Build both js with Webpack and html (Polymer) with Vulcanize
• Minify minify CSS with node-minify and JS with the Uglify Webpack plugin (only with PRODUCTION build)
• Add a hash to the built js and css files names in order to invalidate browser cache on every release (only with PRODUCTION build)

Other commands are included in the bundle of Kubozer:

• Bump for bump the version of your project
• Translate with OneSkyApp

Install

$ yarn add kubozer

Usage

Usage
    $ [NODE_ENV=env_name] kubozer [option]

Options
    --build          Run the build task
    --bump           Semver label for version bump: patch, minor, major, prepatch, preminor, premajor, prerelease
    --config         Load specified Kubozer configuration file
    --webpack-config Load specified Webpack configuration file
    --i18n           Use I18N capabilities
    --upload         Use ONLY with --i18n option: upload a translation file
    --download       Use ONLY with --i18n option: download a translation file

Examples
    $ NODE_ENV=production kubozer --build
    $ kubozer --build --config=../../kubozer.conf.js --webpack-config=another-webpack.config.js
    $ kubozer --bump minor
    $ kubozer --i18n --upload en
    $ kubozer --i18n --download it

Enviroment typed-build

The PRODUCTION build (NODE_ENV=production) will add the minify step to the process. The default build will not produce a minified JS and also CSS.

If you want to handle a dynamic configuration, you can simply check the process.env.NODE_ENV within the kubozer.conf.js (or also webpack.config.js) and change the exported configuration in relation to the NODE_ENV.

Configuration

Kubozer will search for two configurations file: kubozer.conf.js and webpack.config.js (standard Webpack configuration file)

Kubozer

Example configuration. Kubozer will not assume nothing as default.

// kubozer.conf.js
module.exports = {
    workspace: './test/workspace',
    sourceFolder: './test/src-test',
    buildFolder: './test/build',
    // Relative to you workspace
    assetsFolder: 'assets',
    sourceCssFiles: ['/test.css'],
    buildCssFile: 'style.min.css',
    manifest: true,
    stripConsole: true,
    bump: {
        files: [
            './test/src-test/package.json',
            './test/src-test/manifest.json'
        ]
    },
    copy: [
        {
            baseFolder: 'assets',
            items: [
                'imgs-others'
            ]
        }, {
            baseFolder: 'bundles',
            items: [
                ''
            ]
        }
    ],
    replace: {
        css: {
            files: 'index.html',
            commentRegex: ['<!--styles!-->((.|\n)*)<!--styles!-->'],
            with: ['assets/style.min.css']
        },
        js: {
            files: 'index.html',
            commentRegex: ['<!--js!-->((.|\n)*)<!--js!-->'],
            with: ['bundle.js']
        }
    }
    vulcanize: {
        srcTarget: 'index.html',
        buildTarget: 'index.html',
        conf: {
            stripComments: true,
            inlineScripts: true,
            inlineStyles: true,
            excludes: ['bundle.js']
        }
    },
    i18n: {
        secret: 'thisisyoursecret',
        apiKey: 'heregoesyourapikey',
        projectId: 'heyaprojectid',
        defaultLanguage: 'en',
        format: 'HIERARCHICAL_JSON'
        languagesPath: './app/bundles'
    }
};

Webpack

// webpack.config.js
module.exports = {
    entry: {
        main: './src/index.js',
        // Other modules
        vendors: ['fetch', 'array-from']
    }
    output: {
        // Make sure this path is the same of the `buildFolder` of `kubozer.conf.js` if you want to build everithing in the same directory
        path: './test/build',
        // Make sure to use [name] or [id] in output.filename
        //  when using multiple entry points
        filename: '[name].bundle.js'
    },
    devtool: 'source-map',
    module: {
        loaders: [{
            test: /\.js?$/,
            // exclude: /(node_modules|bower_components)/,
            exclude: ['node_modules', 'bundle.js', 'build'],
            loader: 'babel-loader',
            query: {
                presets: ['es2015'],
                plugins: ['transform-es2015-spread', 'syntax-object-rest-spread', 'transform-object-rest-spread']
            }
        }]
    }
};

Programmatic usage

const Kubozer = require('kubozer');
const config = {...};
const webpackConfig = {...};

const isProd = process.env.NODE_ENV === 'production';

// Initialize (check for required config and init workspace folder)
const k = new Kubozer(config, webpackConfig);

// Sync operation
k.deletePrevBuild();

k.copy()
    .then(() => k.replace())
    .then(() => k.build(isProd))
    .then(res => {
        console.log(res);
    })
    .catch(err => {
        console.error(err);
    });

API

deletePrevBuild()

Simply delete the previous build in the "workspace" directory.

copy()

Copy every elements within the object copy.

return Promise

replace()

HTML replace in file. Set a placeholder in your HTML and remove/replace the inner elements during the build.

return Promise

build([minify])

Webpack and Vulcanize following the configuration.

minify: boolean

Choose if minify the content of js files with UglifyJS and css files with clean-css.

return Promise

bump(type)

Bump to new version every file following the configuration.

type: string

Allowed values: patch | minor | major | prepatch | preminor | premajor | prerelease

return Promise

Development

$ git clone https://github.com/contactlab/kubozer.git#development
$ yarn

Build

$ yarn run build

Testing

XO as linter and AVA for units.

$ yarn test

Git branching policies

Any feature/bug fixing/refactor must be developed on a feature branch derived from the develop branch and integrate the changes through a pull request to have a code review.

License

Released under the Apache 2.0 license.