mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-12-22 17:33:23 +01:00
Bundle some ui dependencies separately to limit the build size of ui.js
This commit is contained in:
parent
ac079365e6
commit
da5f4a792c
@ -7,6 +7,7 @@
|
||||
</head>
|
||||
<body>
|
||||
<div id="app-content"></div>
|
||||
<script src="./libs.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script src="./ui.js" type="text/javascript" charset="utf-8"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
@ -11,6 +11,7 @@
|
||||
</head>
|
||||
<body class="notification" style="height:600px;">
|
||||
<div id="app-content"></div>
|
||||
<script src="./libs.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script src="./ui.js" type="text/javascript" charset="utf-8"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
@ -7,6 +7,7 @@
|
||||
</head>
|
||||
<body style="width:357px; height:600px;">
|
||||
<div id="app-content"></div>
|
||||
<script src="./libs.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script src="./ui.js" type="text/javascript" charset="utf-8"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
46
gulpfile.js
46
gulpfile.js
@ -26,6 +26,16 @@ const pify = require('pify')
|
||||
const gulpMultiProcess = require('gulp-multi-process')
|
||||
const endOfStream = pify(require('end-of-stream'))
|
||||
|
||||
const packageJSON = require('./package.json')
|
||||
const dependencies = Object.keys(packageJSON && packageJSON.dependencies || {})
|
||||
const materialUIDependencies = ['@material-ui/core']
|
||||
const reactDepenendencies = dependencies.filter(dep => dep.match(/react/))
|
||||
|
||||
const uiDependenciesToBundle = [
|
||||
...materialUIDependencies,
|
||||
...reactDepenendencies,
|
||||
]
|
||||
|
||||
function gulpParallel (...args) {
|
||||
return function spawnGulpChildProcess (cb) {
|
||||
return gulpMultiProcess(args, cb, true)
|
||||
@ -279,11 +289,32 @@ const buildJsFiles = [
|
||||
]
|
||||
|
||||
// bundle tasks
|
||||
createTasksForBuildJsUIDeps({ dependenciesToBundle: uiDependenciesToBundle, filename: 'libs' })
|
||||
createTasksForBuildJsExtension({ buildJsFiles, taskPrefix: 'dev:extension:js', devMode: true })
|
||||
createTasksForBuildJsExtension({ buildJsFiles, taskPrefix: 'build:extension:js' })
|
||||
createTasksForBuildJsMascara({ taskPrefix: 'build:mascara:js' })
|
||||
createTasksForBuildJsMascara({ taskPrefix: 'dev:mascara:js', devMode: true })
|
||||
|
||||
function createTasksForBuildJsUIDeps ({ dependenciesToBundle, filename }) {
|
||||
const destinations = browserPlatforms.map(platform => `./dist/${platform}`)
|
||||
|
||||
const bundleTaskOpts = Object.assign({
|
||||
buildSourceMaps: true,
|
||||
sourceMapDir: '../sourcemaps',
|
||||
minifyBuild: true,
|
||||
devMode: false,
|
||||
})
|
||||
|
||||
gulp.task('build:extension:js:uideps', bundleTask(Object.assign({
|
||||
label: filename,
|
||||
filename: `${filename}.js`,
|
||||
destinations,
|
||||
buildLib: true,
|
||||
dependenciesToBundle: uiDependenciesToBundle,
|
||||
}, bundleTaskOpts)))
|
||||
}
|
||||
|
||||
|
||||
function createTasksForBuildJsExtension ({ buildJsFiles, taskPrefix, devMode, bundleTaskOpts = {} }) {
|
||||
// inpage must be built before all other scripts:
|
||||
const rootDir = './app/scripts'
|
||||
@ -326,6 +357,7 @@ function createTasksForBuildJs ({ rootDir, taskPrefix, bundleTaskOpts, destinati
|
||||
label: jsFile,
|
||||
filename: `${jsFile}.js`,
|
||||
filepath: `${rootDir}/${jsFile}.js`,
|
||||
externalDependencies: jsFile === 'ui' && !bundleTaskOpts.devMode && uiDependenciesToBundle,
|
||||
destinations,
|
||||
}, bundleTaskOpts)))
|
||||
})
|
||||
@ -402,6 +434,7 @@ gulp.task('build',
|
||||
'clean',
|
||||
'build:scss',
|
||||
gulpParallel(
|
||||
'build:extension:js:uideps',
|
||||
'build:extension:js',
|
||||
'build:mascara:js',
|
||||
'copy'
|
||||
@ -450,14 +483,25 @@ function zipTask (target) {
|
||||
|
||||
function generateBundler (opts, performBundle) {
|
||||
const browserifyOpts = assign({}, watchify.args, {
|
||||
entries: [opts.filepath],
|
||||
plugin: 'browserify-derequire',
|
||||
debug: opts.buildSourceMaps,
|
||||
fullPaths: opts.buildWithFullPaths,
|
||||
})
|
||||
|
||||
if (!opts.buildLib) {
|
||||
browserifyOpts['entries'] = [opts.filepath]
|
||||
}
|
||||
|
||||
let bundler = browserify(browserifyOpts)
|
||||
|
||||
if (opts.buildLib) {
|
||||
bundler = bundler.require(opts.dependenciesToBundle)
|
||||
}
|
||||
|
||||
if (opts.externalDependencies) {
|
||||
bundler = bundler.external(opts.externalDependencies)
|
||||
}
|
||||
|
||||
// inject variables into bundle
|
||||
bundler.transform(envify({
|
||||
METAMASK_DEBUG: opts.devMode,
|
||||
|
Loading…
Reference in New Issue
Block a user