reduces development driver size to ~683k by removing vendor sourceMaps
This commit is contained in:
Dan Matthews
parent
b315b8fe68
commit
28d9cfc0fa
13
package.json
13
package.json
|
|
@ -12,13 +12,14 @@
|
|||
"author": "BigchainDB",
|
||||
"main": "./dist/node/index.js",
|
||||
"browser": "./dist/browser/bigchaindb-driver.cjs2.min.js",
|
||||
"sideEffects": false,
|
||||
"scripts": {
|
||||
"lint": "eslint ./{src,test,examples}/**/*.js",
|
||||
"build": "npm run clean && npm run build:cjs && npm run build:dist",
|
||||
"build:bundle": "webpack",
|
||||
"build:cjs": "cross-env BABEL_ENV=cjs babel ./src -d dist/node",
|
||||
"build:dist": "cross-env NODE_ENV=production webpack -p",
|
||||
"dev": "webpack -p -w",
|
||||
"build:dist": "cross-env NODE_ENV=production webpack -w",
|
||||
"dev": "webpack -w",
|
||||
"clean": "rimraf dist/bundle dist/node",
|
||||
"test": "npm run lint && nyc ava test/ && npm run thanks && npm run report-coverage",
|
||||
"thanks": "cowsay Hi, thanks for your interest in BigchainDB. We appreciate your contribution!",
|
||||
|
|
@ -61,7 +62,8 @@
|
|||
"rimraf": "^2.6.2",
|
||||
"sinon": "^6.1.0",
|
||||
"webpack": "^4.16.1",
|
||||
"webpack-cli": "^3.0.8"
|
||||
"webpack-cli": "^3.0.8",
|
||||
"webpack-concat-plugin": "^3.0.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"browser-resolve": "^1.11.3",
|
||||
|
|
@ -79,7 +81,10 @@
|
|||
"json-stable-stringify": "^1.0.1",
|
||||
"query-string": "^6.0.0",
|
||||
"sprintf-js": "^1.1.1",
|
||||
"tweetnacl": "^1.0.0"
|
||||
"tweetnacl": "^1.0.0",
|
||||
"uglifyjs-webpack-plugin": "^1.2.7",
|
||||
"webpack-merge": "^4.1.3",
|
||||
"webpack-sources": "^1.1.0"
|
||||
},
|
||||
"keywords": [
|
||||
"bigchaindb",
|
||||
|
|
|
|||
|
|
@ -0,0 +1,31 @@
|
|||
const { ConcatSource } = require('webpack-sources')
|
||||
|
||||
module.exports = class AddVendorsPlugin {
|
||||
constructor(base) {
|
||||
this.base = base
|
||||
}
|
||||
|
||||
apply(compiler) {
|
||||
compiler.hooks.emit.tapAsync(
|
||||
`AddVendorsPlugin ${this.base}`,
|
||||
(compilation, callback) => {
|
||||
const main = compilation.assets[`main.${this.base}`]
|
||||
const mainMap = compilation.assets[`main.${this.base}.map`]
|
||||
const vendor = compilation.assets[`vendors.${this.base}`]
|
||||
|
||||
if (main && vendor) {
|
||||
const compiledAsset = new ConcatSource(main.children[0])
|
||||
compiledAsset.add(vendor)
|
||||
compiledAsset.add(main.children[1])
|
||||
compilation.assets = {}
|
||||
compilation.assets[this.base] = compiledAsset
|
||||
} else if (main && mainMap) {
|
||||
compilation.assets = {}
|
||||
compilation.assets[this.base] = main
|
||||
compilation.assets[`${this.base}.map`] = mainMap
|
||||
}
|
||||
callback()
|
||||
}
|
||||
)
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,29 @@
|
|||
/* eslint-disable strict, no-console, object-shorthand */
|
||||
|
||||
'use strict'
|
||||
|
||||
const { paths } = require('./webpack.parts.js')
|
||||
|
||||
module.exports = {
|
||||
entry: paths.entry,
|
||||
mode: 'none',
|
||||
module: {
|
||||
rules: [
|
||||
{
|
||||
test: /\.js$/,
|
||||
exclude: /node_modules/,
|
||||
use: {
|
||||
loader: 'babel-loader',
|
||||
},
|
||||
}
|
||||
]
|
||||
},
|
||||
optimization: {
|
||||
minimize: true,
|
||||
noEmitOnErrors: true
|
||||
},
|
||||
resolve: {
|
||||
extensions: ['.js'],
|
||||
modules: ['node_modules'],
|
||||
},
|
||||
}
|
||||
|
|
@ -2,112 +2,29 @@
|
|||
|
||||
'use strict'
|
||||
|
||||
const path = require('path')
|
||||
|
||||
const webpack = require('webpack')
|
||||
|
||||
const PRODUCTION = process.env.NODE_ENV === 'production'
|
||||
|
||||
const PATHS = {
|
||||
ENTRY: path.resolve(__dirname, './src/index.js'),
|
||||
BUNDLE: path.resolve(__dirname, 'dist/browser'),
|
||||
NODE_MODULES: path.resolve(__dirname, 'node_modules'),
|
||||
const common = require('./webpack.common.js')
|
||||
|
||||
const { outputs } = require('./webpack.parts.js')
|
||||
|
||||
// '[libraryTarget]': [file extension]
|
||||
const OUTPUT_MAPPING = {
|
||||
'amd': 'amd',
|
||||
'commonjs': 'cjs',
|
||||
'commonjs2': 'cjs2',
|
||||
'umd': 'umd',
|
||||
'window': 'window',
|
||||
}
|
||||
|
||||
const OUTPUTS = [
|
||||
{
|
||||
filename: PRODUCTION ? 'bigchaindb-driver.window.min.js' : 'bigchaindb-driver.window.js',
|
||||
library: 'BigchainDB',
|
||||
libraryTarget: 'window',
|
||||
path: PATHS.BUNDLE,
|
||||
},
|
||||
{
|
||||
filename: PRODUCTION ? 'bigchaindb-driver.umd.min.js' : 'bigchaindb-driver.umd.js',
|
||||
library: 'bigchaindb-driver',
|
||||
libraryTarget: 'umd',
|
||||
path: PATHS.BUNDLE,
|
||||
},
|
||||
{
|
||||
filename: PRODUCTION ? 'bigchaindb-driver.cjs.min.js' : 'bigchaindb-driver.cjs.js',
|
||||
library: 'bigchaindb-driver',
|
||||
libraryTarget: 'commonjs',
|
||||
path: PATHS.BUNDLE,
|
||||
},
|
||||
{
|
||||
filename: PRODUCTION ? 'bigchaindb-driver.cjs2.min.js' : 'bigchaindb-driver.cjs2.js',
|
||||
library: 'bigchaindb-driver',
|
||||
libraryTarget: 'commonjs2',
|
||||
path: PATHS.BUNDLE,
|
||||
},
|
||||
{
|
||||
filename: PRODUCTION ? 'bigchaindb-driver.amd.min.js' : 'bigchaindb-driver.amd.js',
|
||||
library: 'bigchaindb-driver',
|
||||
libraryTarget: 'amd',
|
||||
path: PATHS.BUNDLE,
|
||||
}
|
||||
]
|
||||
|
||||
|
||||
/** PLUGINS **/
|
||||
const PLUGINS = [
|
||||
new webpack.NoEmitOnErrorsPlugin(),
|
||||
]
|
||||
|
||||
const PROD_PLUGINS = [
|
||||
/*
|
||||
new webpack.optimize.UglifyJsPlugin({
|
||||
compress: {
|
||||
warnings: false,
|
||||
},
|
||||
output: {
|
||||
comments: false,
|
||||
},
|
||||
sourceMap: true,
|
||||
}),
|
||||
new webpack.LoaderOptionsPlugin({
|
||||
debug: false,
|
||||
minimize: true,
|
||||
}),
|
||||
*/
|
||||
]
|
||||
const OVERRIDES = {
|
||||
// optimization: {
|
||||
// minimize: false
|
||||
// }
|
||||
}
|
||||
|
||||
if (PRODUCTION) {
|
||||
PLUGINS.push(...PROD_PLUGINS)
|
||||
module.exports = outputs(common, 'production', OUTPUT_MAPPING, OVERRIDES)
|
||||
} else {
|
||||
module.exports = outputs(common, 'development', OUTPUT_MAPPING, OVERRIDES)
|
||||
}
|
||||
|
||||
const configBoilerplate = {
|
||||
entry: [PATHS.ENTRY],
|
||||
|
||||
devtool: PRODUCTION ? '#source-map' : '#inline-source-map',
|
||||
|
||||
resolve: {
|
||||
extensions: ['.js'],
|
||||
modules: ['node_modules'], // Don't use absolute path here to allow recursive matching
|
||||
},
|
||||
|
||||
plugins: PLUGINS,
|
||||
|
||||
module: {
|
||||
rules: [
|
||||
{
|
||||
test: /\.js$/,
|
||||
exclude: [PATHS.NODE_MODULES],
|
||||
use: [{
|
||||
loader: 'babel-loader',
|
||||
options: {
|
||||
cacheDirectory: true,
|
||||
},
|
||||
}],
|
||||
},
|
||||
],
|
||||
},
|
||||
}
|
||||
|
||||
/** EXPORTED WEBPACK CONFIG **/
|
||||
const config = OUTPUTS.map(output => {
|
||||
const configCopy = Object.assign({}, configBoilerplate)
|
||||
configCopy.output = output
|
||||
return configCopy
|
||||
})
|
||||
|
||||
module.exports = config
|
||||
|
|
|
|||
|
|
@ -0,0 +1,30 @@
|
|||
/* eslint-disable strict, no-console, object-shorthand */
|
||||
|
||||
'use strict'
|
||||
|
||||
const UglifyJsPlugin = require('uglifyjs-webpack-plugin')
|
||||
|
||||
module.exports = {
|
||||
devtool: 'inline-source-map',
|
||||
optimization: {
|
||||
minimizer: [
|
||||
new UglifyJsPlugin({
|
||||
test: /vendor/,
|
||||
sourceMap: false,
|
||||
}),
|
||||
new UglifyJsPlugin({
|
||||
test: /^((?!(vendor)).)*.js$/,
|
||||
sourceMap: true,
|
||||
})
|
||||
],
|
||||
splitChunks: {
|
||||
cacheGroups: {
|
||||
commons: {
|
||||
test: /[\\/]node_modules[\\/]/,
|
||||
name: 'vendors',
|
||||
chunks: 'all'
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
|
|
@ -0,0 +1,55 @@
|
|||
/* eslint-disable strict, no-console, object-shorthand */
|
||||
|
||||
'use strict'
|
||||
|
||||
const path = require('path')
|
||||
const merge = require('webpack-merge')
|
||||
|
||||
const development = require('./webpack.development.js')
|
||||
const production = require('./webpack.production.js')
|
||||
|
||||
const AddVendorsPlugin = require('./plugins/add-vendors-plugin')
|
||||
|
||||
const paths = {
|
||||
entry: path.resolve(__dirname, './src/index.js'),
|
||||
bundle: path.resolve(__dirname, 'dist/browser'),
|
||||
}
|
||||
|
||||
const outputs = (base, env, mapping, overrides) => {
|
||||
const collection = []
|
||||
const library = 'bigchaindb-driver'
|
||||
const windowLibrary = 'BigchainDB'
|
||||
|
||||
let environment = development
|
||||
let ext = 'js'
|
||||
|
||||
if (env === 'production') {
|
||||
environment = production
|
||||
ext = `min.${ext}`
|
||||
}
|
||||
|
||||
Object.entries(mapping).forEach(([target, extension]) => {
|
||||
const filename = `[name].${library}.${extension}.${ext}`
|
||||
|
||||
const compiled = {
|
||||
output: {
|
||||
filename: filename,
|
||||
library: target === 'window' ? windowLibrary : library,
|
||||
libraryTarget: target,
|
||||
path: paths.bundle
|
||||
},
|
||||
plugins: [
|
||||
new AddVendorsPlugin(`${library}.${extension}.${ext}`)
|
||||
]
|
||||
}
|
||||
|
||||
collection.push(merge(base, environment, compiled, overrides))
|
||||
})
|
||||
|
||||
return collection
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
outputs,
|
||||
paths
|
||||
}
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
/* eslint-disable strict, no-console, object-shorthand */
|
||||
|
||||
'use strict'
|
||||
|
||||
module.exports = {
|
||||
devtool: 'source-map',
|
||||
}
|
||||
Loading…
Reference in New Issue