chore(project): build pre-packaged distros with Rollup
* enables tree-shaking * simplifies build
This commit is contained in:
Nico Rehwaldt
parent
d3449ca87c
commit
3c895e08ae
|
|
@ -1,5 +1,5 @@
|
|||
{
|
||||
"extends": "plugin:bpmn-io/es5",
|
||||
"extends": "plugin:bpmn-io/es6",
|
||||
"env": {
|
||||
"browser": true
|
||||
}
|
||||
|
|
|
|||
|
|
@ -11,4 +11,5 @@ test/*
|
|||
.eslintrc
|
||||
.travis.yml
|
||||
.wiredeps
|
||||
CONTRIBUTING.md
|
||||
CONTRIBUTING.md
|
||||
rollup.config.js
|
||||
15
package.json
15
package.json
|
|
@ -37,19 +37,13 @@
|
|||
"license": "SEE LICENSE IN LICENSE",
|
||||
"devDependencies": {
|
||||
"babel-core": "^6.26.0",
|
||||
"babel-plugin-add-module-exports": "^0.2.1",
|
||||
"babel-preset-env": "^1.6.1",
|
||||
"babelify": "^8.0.0",
|
||||
"browser-pack-flat": "^3.0.8",
|
||||
"browserify": "^14.5.0",
|
||||
"browserify-derequire": "^0.9.1",
|
||||
"bundle-collapser": "^1.1.1",
|
||||
"chai": "^4.1.2",
|
||||
"chai-match": "^1.1.1",
|
||||
"common-shakeify": "^0.4.6",
|
||||
"cpx": "^1.5.0",
|
||||
"del": "^3.0.0",
|
||||
"envify": "^4.1.0",
|
||||
"eslint": "^4.19.0",
|
||||
"eslint-plugin-bpmn-io": "^0.5.2",
|
||||
"execa": "^0.8.0",
|
||||
|
|
@ -71,11 +65,16 @@
|
|||
"npm-run-all": "^4.1.2",
|
||||
"phantomjs-prebuilt": "^2.1.12",
|
||||
"puppeteer": "^0.13.0",
|
||||
"rollup": "^0.57.1",
|
||||
"rollup-plugin-commonjs": "^9.1.0",
|
||||
"rollup-plugin-json": "^2.3.0",
|
||||
"rollup-plugin-license": "^0.6.0",
|
||||
"rollup-plugin-node-resolve": "^3.3.0",
|
||||
"rollup-plugin-replace": "^2.0.0",
|
||||
"rollup-plugin-uglify": "^3.0.0",
|
||||
"sinon": "^4.4.6",
|
||||
"sinon-chai": "^2.14.0",
|
||||
"stringify": "^5.2.0",
|
||||
"uglify-es": "^3.3.10",
|
||||
"unassertify": "^2.1.0",
|
||||
"watchify": "^3.11.0"
|
||||
},
|
||||
"dependencies": {
|
||||
|
|
|
|||
|
|
@ -1 +1 @@
|
|||
/*! bpmn-js - {{ variant }} v{{ version }} | Copyright (c) 2014-present, camunda Services GmbH | bpmn.io/license */
|
||||
/*! bpmn-js - {{ name }} v{{ version }} | Copyright (c) 2014-present, camunda Services GmbH | bpmn.io/license */
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
/*!
|
||||
* bpmn-js - {{ variant }} v{{ version }}
|
||||
* bpmn-js - {{ name }} v{{ version }}
|
||||
*
|
||||
* Copyright (c) 2014-present, camunda Services GmbH
|
||||
*
|
||||
|
|
@ -9,4 +9,4 @@
|
|||
* Source Code: https://github.com/bpmn-io/bpmn-js
|
||||
*
|
||||
* Date: {{ date }}
|
||||
*/
|
||||
*/
|
||||
|
|
@ -0,0 +1,140 @@
|
|||
import uglify from 'rollup-plugin-uglify';
|
||||
import nodeResolve from 'rollup-plugin-node-resolve';
|
||||
import commonjs from 'rollup-plugin-commonjs';
|
||||
import json from 'rollup-plugin-json';
|
||||
import license from 'rollup-plugin-license';
|
||||
import replace from 'rollup-plugin-replace';
|
||||
|
||||
import {
|
||||
readFileSync
|
||||
} from 'fs';
|
||||
|
||||
import pkg from './package.json';
|
||||
|
||||
const outputDir = 'dist';
|
||||
|
||||
const distros = [
|
||||
{
|
||||
input: 'Viewer',
|
||||
output: 'bpmn-viewer'
|
||||
},
|
||||
{
|
||||
input: 'NavigatedViewer',
|
||||
output: 'bpmn-navigated-viewer'
|
||||
},
|
||||
{
|
||||
input: 'Modeler',
|
||||
output: 'bpmn-modeler'
|
||||
}
|
||||
];
|
||||
|
||||
const configs = distros.reduce(function(configs, distro) {
|
||||
const {
|
||||
input,
|
||||
output
|
||||
} = distro;
|
||||
|
||||
return [
|
||||
...configs,
|
||||
{
|
||||
input: `./lib/${input}.js`,
|
||||
output: {
|
||||
name: 'BpmnJS',
|
||||
file: `${outputDir}/${output}.development.js`,
|
||||
format: 'umd'
|
||||
},
|
||||
plugins: pgl([
|
||||
banner(output)
|
||||
])
|
||||
},
|
||||
{
|
||||
input: `./lib/${input}.js`,
|
||||
output: {
|
||||
name: 'BpmnJS',
|
||||
file: `${outputDir}/${output}.production.min.js`,
|
||||
format: 'umd'
|
||||
},
|
||||
plugins: pgl([
|
||||
banner(output, true),
|
||||
uglify({
|
||||
output: {
|
||||
comments: /license|@preserve/
|
||||
}
|
||||
})
|
||||
])
|
||||
}
|
||||
];
|
||||
}, []);
|
||||
|
||||
export default configs;
|
||||
|
||||
|
||||
// helpers //////////////////////
|
||||
|
||||
function banner(bundleName, minified) {
|
||||
|
||||
const bannerName = (
|
||||
minified
|
||||
? 'banner-min'
|
||||
: 'banner'
|
||||
);
|
||||
|
||||
const bannerTemplate = readFileSync(`${__dirname}/resources/${bannerName}.txt`, 'utf8');
|
||||
|
||||
const banner = processTemplate(bannerTemplate, {
|
||||
version: pkg.version,
|
||||
date: today(),
|
||||
name: bundleName
|
||||
});
|
||||
|
||||
return license({
|
||||
banner
|
||||
});
|
||||
}
|
||||
|
||||
function pgl(plugins=[]) {
|
||||
return [
|
||||
replace({
|
||||
'process.env.NODE_ENV': JSON.stringify('production')
|
||||
}),
|
||||
nodeResolve({
|
||||
module: true,
|
||||
main: true,
|
||||
browser: true
|
||||
}),
|
||||
commonjs(),
|
||||
json(),
|
||||
...plugins
|
||||
];
|
||||
}
|
||||
|
||||
function pad(n) {
|
||||
if (n < 10) {
|
||||
return '0' + n;
|
||||
} else {
|
||||
return n;
|
||||
}
|
||||
}
|
||||
|
||||
function today() {
|
||||
const d = new Date();
|
||||
|
||||
return [
|
||||
d.getFullYear(),
|
||||
pad(d.getMonth() + 1),
|
||||
pad(d.getDay())
|
||||
].join('-');
|
||||
}
|
||||
|
||||
function processTemplate(str, args) {
|
||||
return str.replace(/\{\{\s*([^\s]+)\s*\}\}/g, function(_, n) {
|
||||
|
||||
var replacement = args[n];
|
||||
|
||||
if (!replacement) {
|
||||
throw new Error('unknown template {{ ' + n + '}}');
|
||||
}
|
||||
|
||||
return replacement;
|
||||
});
|
||||
}
|
||||
|
|
@ -1,10 +1,9 @@
|
|||
'use strict';
|
||||
|
||||
var bundle = require('./bundle');
|
||||
|
||||
var path = require('path');
|
||||
|
||||
var mkdirp = require('mkdirp').sync,
|
||||
var exec = require('execa').sync,
|
||||
mkdirp = require('mkdirp').sync,
|
||||
cp = require('cpx').copySync,
|
||||
del = require('del').sync;
|
||||
|
||||
|
|
@ -29,13 +28,23 @@ cp(resolve('bpmn-font', '/dist/{font,css}/**'), dest + '/assets/bpmn-font');
|
|||
console.log('copy diagram-js.css to ' + dest);
|
||||
cp(resolve('diagram-js', '/assets/**'), dest + '/assets');
|
||||
|
||||
bundle(dest, {
|
||||
'bpmn-viewer': 'lib/Viewer.js',
|
||||
'bpmn-navigated-viewer': 'lib/NavigatedViewer.js',
|
||||
'bpmn-modeler': 'lib/Modeler.js'
|
||||
}, function(err) {
|
||||
console.log('building pre-packaged distributions');
|
||||
|
||||
if (err) {
|
||||
console.error('bundling failed', err);
|
||||
var NODE_ENV = process.env.NODE_ENV;
|
||||
|
||||
[ 'production', 'development' ].forEach(function(env) {
|
||||
|
||||
try {
|
||||
process.env.NODE_ENV = env;
|
||||
|
||||
exec('rollup', [ '-c' ]);
|
||||
} catch (e) {
|
||||
console.error('failed to build pre-package distributions', e);
|
||||
|
||||
process.exit(1);
|
||||
}
|
||||
});
|
||||
|
||||
process.env.NODE_ENV = NODE_ENV;
|
||||
});
|
||||
|
||||
console.log('done.');
|
||||
217
tasks/bundle.js
217
tasks/bundle.js
|
|
@ -1,217 +0,0 @@
|
|||
'use strict';
|
||||
|
||||
var bbl = require('babel-plugin-add-module-exports');
|
||||
|
||||
var browserify = require('browserify'),
|
||||
derequire = require('browserify-derequire'),
|
||||
collapse = require('bundle-collapser/plugin'),
|
||||
fs = require('fs'),
|
||||
path = require('path'),
|
||||
flattenBundle = require('browser-pack-flat/plugin'),
|
||||
commonShake = require('common-shakeify'),
|
||||
unassertify = require('unassertify'),
|
||||
uglify = require('uglify-es'),
|
||||
envify = require('envify');
|
||||
|
||||
var pkg = require('../package');
|
||||
|
||||
var asyncSeries = require('./helpers').asyncSeries;
|
||||
|
||||
var BANNER = fs.readFileSync(__dirname + '/../resources/banner.txt', 'utf8'),
|
||||
BANNER_MIN = fs.readFileSync(__dirname + '/../resources/banner-min.txt', 'utf8');
|
||||
|
||||
|
||||
module.exports = function bundleAll(dest, targets, done) {
|
||||
|
||||
var fns = Object.keys(targets).map(function(k) {
|
||||
|
||||
var variant = k;
|
||||
var entry = targets[k];
|
||||
|
||||
return function(done) {
|
||||
console.log('\nbundle ' + variant);
|
||||
|
||||
bundle(dest, variant, entry, done);
|
||||
};
|
||||
});
|
||||
|
||||
asyncSeries(fns, done);
|
||||
};
|
||||
|
||||
|
||||
|
||||
function Timer() {
|
||||
this.reset();
|
||||
}
|
||||
|
||||
Timer.prototype.done = function(message) {
|
||||
console.log(message, '[' + (this.now() - this.s) + 'ms]');
|
||||
this.reset();
|
||||
};
|
||||
|
||||
Timer.prototype.reset = function() {
|
||||
this.s = this.now();
|
||||
};
|
||||
|
||||
Timer.prototype.start = function(msg) {
|
||||
this.reset();
|
||||
};
|
||||
|
||||
Timer.prototype.now = function() {
|
||||
return new Date().getTime();
|
||||
};
|
||||
|
||||
function processTemplate(str, args) {
|
||||
return str.replace(/\{\{\s*([^\s]+)\s*\}\}/g, function(_, n) {
|
||||
|
||||
var replacement = args[n];
|
||||
|
||||
if (!replacement) {
|
||||
throw new Error('unknown template {{ ' + n + '}}');
|
||||
}
|
||||
|
||||
return replacement;
|
||||
});
|
||||
}
|
||||
|
||||
function pad(n) {
|
||||
if (n < 10) {
|
||||
return '0' + n;
|
||||
} else {
|
||||
return n;
|
||||
}
|
||||
}
|
||||
|
||||
function today() {
|
||||
var d = new Date();
|
||||
|
||||
return [
|
||||
d.getFullYear(),
|
||||
pad(d.getMonth() + 1),
|
||||
pad(d.getDay())
|
||||
].join('-');
|
||||
}
|
||||
|
||||
function bundle(dest, variant, entry, done) {
|
||||
|
||||
var src = path.resolve(entry);
|
||||
|
||||
var config = {
|
||||
variant: variant,
|
||||
version: pkg.version,
|
||||
date: today()
|
||||
};
|
||||
|
||||
var browserifyOptions = {
|
||||
standalone: 'BpmnJS',
|
||||
builtins: false,
|
||||
insertGlobalVars: {
|
||||
process: function() {
|
||||
return 'undefined';
|
||||
},
|
||||
Buffer: function() {
|
||||
return 'undefined';
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
var targetFileBase = path.join(dest, variant);
|
||||
|
||||
var banner = processTemplate(BANNER, config),
|
||||
bannerMin = processTemplate(BANNER_MIN, config);
|
||||
|
||||
var timer = new Timer();
|
||||
|
||||
var fns = [
|
||||
|
||||
// production
|
||||
function(done) {
|
||||
|
||||
timer.start('build prod');
|
||||
|
||||
browserify(browserifyOptions)
|
||||
.transform('babelify', {
|
||||
global: true,
|
||||
babelrc: false,
|
||||
presets: [ 'env' ],
|
||||
plugins: [
|
||||
bbl
|
||||
]
|
||||
})
|
||||
.transform(envify, {
|
||||
NODE_ENV: 'production'
|
||||
})
|
||||
.transform(unassertify)
|
||||
.plugin(commonShake)
|
||||
.plugin(flattenBundle)
|
||||
.plugin(collapse)
|
||||
.plugin(derequire)
|
||||
.add(src)
|
||||
.bundle(function(err, result) {
|
||||
|
||||
timer.done('bundled');
|
||||
|
||||
if (err) {
|
||||
return done(err);
|
||||
}
|
||||
|
||||
var str = result.toString('utf-8');
|
||||
|
||||
var minified = uglify.minify(str, {
|
||||
compress: true,
|
||||
mangle: true,
|
||||
output: {
|
||||
preamble: bannerMin
|
||||
}
|
||||
});
|
||||
|
||||
timer.done('minified');
|
||||
|
||||
fs.writeFileSync(targetFileBase + '.production.min.js', minified.code, 'utf8');
|
||||
|
||||
timer.done('wrote ' + targetFileBase + '.production.min.js');
|
||||
|
||||
done();
|
||||
});
|
||||
},
|
||||
|
||||
// development
|
||||
function(done) {
|
||||
timer.start('build dev');
|
||||
|
||||
browserify(browserifyOptions)
|
||||
.transform('babelify', {
|
||||
global: true,
|
||||
babelrc: false,
|
||||
presets: [ 'env' ],
|
||||
plugins: [
|
||||
bbl
|
||||
]
|
||||
})
|
||||
.transform(envify, {
|
||||
NODE_ENV: 'development'
|
||||
})
|
||||
.plugin(collapse)
|
||||
.plugin(derequire)
|
||||
.add(src)
|
||||
.bundle(function(err, result) {
|
||||
|
||||
timer.done('bundled');
|
||||
|
||||
if (err) {
|
||||
return done(err);
|
||||
}
|
||||
|
||||
var code = banner + result.toString('utf-8');
|
||||
|
||||
fs.writeFileSync(targetFileBase + '.development.js', code, 'utf8');
|
||||
|
||||
timer.done('wrote ' + targetFileBase + '.development.js');
|
||||
|
||||
done();
|
||||
});
|
||||
}
|
||||
];
|
||||
|
||||
asyncSeries(fns, done);
|
||||
}
|
||||
Loading…
Reference in New Issue