Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add a UMD build for workbox-window #1895

Merged
merged 1 commit into from
Feb 12, 2019
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
47 changes: 12 additions & 35 deletions gulp-tasks/utils/build-browser-bundle.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,17 +6,10 @@
https://opensource.org/licenses/MIT.
*/

const buffer = require('vinyl-buffer');
const fs = require('fs-extra');
const gulp = require('gulp');
const oneLine = require('common-tags').oneLine;
const path = require('path');
const rename = require('gulp-rename');
const rollup = require('rollup');
const rollupStream = require('rollup-stream');
const source = require('vinyl-source-stream');
const sourcemaps = require('gulp-sourcemaps');

const {rollup} = require('rollup');
const constants = require('./constants');
const logHelper = require('../../infra/utils/log-helper');
const pkgPathToName = require('./pkg-path-to-name');
Expand Down Expand Up @@ -97,7 +90,7 @@ const externalAndPure = (importPath) => {
return (importPath.indexOf('workbox-') === 0);
};

module.exports = (packagePath, buildType) => {
module.exports = async (packagePath, buildType) => {
const packageName = pkgPathToName(packagePath);
const packageIndex = path.join(packagePath, `index.mjs`);

Expand Down Expand Up @@ -140,15 +133,8 @@ module.exports = (packagePath, buildType) => {

const plugins = rollupHelper.getDefaultPlugins(buildType);

return rollupStream({
const bundle = await rollup({
input: packageIndex,
rollup,
output: {
name: namespace,
sourcemap: true,
format: 'iife',
globals,
},
external: externalAndPure,
treeshake: {
pureExternalModules: externalAndPure,
Expand All @@ -170,22 +156,13 @@ module.exports = (packagePath, buildType) => {
throw new Error(`Unhandled Rollup Warning: ${warning}`);
}
},
})
.on('error', (err) => {
const args = Object.keys(err).map((key) => `${key}: ${err[key]}`);
logHelper.error(err, `\n\n${args.join('\n')}`);
throw err;
})
// We must give the generated stream the same name as the entry file
// for the sourcemaps to work correctly
.pipe(source(packageIndex))
// gulp-sourcemaps don't work with streams so we need
.pipe(buffer())
// This tells gulp-sourcemaps to load the inline sourcemap
.pipe(sourcemaps.init({loadMaps: true}))
// This renames the output file
.pipe(rename(outputFilename))
// This writes the sourcemap alongside the final build file
.pipe(sourcemaps.write('.'))
.pipe(gulp.dest(outputDirectory));
});

await bundle.write({
file: path.join(outputDirectory, outputFilename),
name: namespace,
sourcemap: true,
format: 'iife',
globals,
});
};
60 changes: 25 additions & 35 deletions gulp-tasks/utils/build-window-bundle.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,16 +6,9 @@
https://opensource.org/licenses/MIT.
*/

const buffer = require('vinyl-buffer');
const fs = require('fs-extra');
const gulp = require('gulp');
const path = require('path');
const rename = require('gulp-rename');
const rollup = require('rollup');
const rollupStream = require('rollup-stream');
const source = require('vinyl-source-stream');
const sourcemaps = require('gulp-sourcemaps');

const {rollup} = require('rollup');
const constants = require('./constants');
const logHelper = require('../../infra/utils/log-helper');
const pkgPathToName = require('./pkg-path-to-name');
Expand All @@ -26,7 +19,7 @@ const ERROR_NO_MODULE_BROWSER =
`Could not find the module's index.mjs file: `;


module.exports = (packagePath, buildType) => {
module.exports = async (packagePath, buildType) => {
const packageName = pkgPathToName(packagePath);
const moduleBrowserPath = path.join(packagePath, `index.mjs`);

Expand All @@ -37,25 +30,24 @@ module.exports = (packagePath, buildType) => {
return Promise.reject(ERROR_NO_MODULE_BROWSER + packageName);
}

const outputFilename = `${packageName}.${buildType.slice(0, 4)}.mjs`;
const outputDirectory = path.join(
packagePath, constants.PACKAGE_BUILD_DIRNAME);

const esFilename = `${packageName}.${buildType.slice(0, 4)}.mjs`;
const umdFilename = `${packageName}.${buildType.slice(0, 4)}.umd.js`;

logHelper.log(
`Building window module bundle: ${logHelper.highlight(esFilename)}`);
logHelper.log(
`Building Window Bundle: ${logHelper.highlight(outputFilename)}`);
`Building window UMD bundle: ${logHelper.highlight(umdFilename)}`);

// TODO(philipwalton): ensure all loaded workbox modules conform to
// the same conventions we document to external developers. This can be
// done with a Rollup plugin that validates them.
const plugins = rollupHelper.getDefaultPlugins(buildType, {module: true});

return rollupStream({
const bundle = await rollup({
input: moduleBrowserPath,
rollup,
output: {
sourcemap: true,
format: 'es',
},
plugins,
onwarn: (warning) => {
if (buildType === constants.BUILD_TYPES.prod &&
Expand All @@ -73,22 +65,20 @@ module.exports = (packagePath, buildType) => {
throw new Error(`Unhandled Rollup Warning: ${warning}`);
}
},
})
.on('error', (err) => {
const args = Object.keys(err).map((key) => `${key}: ${err[key]}`);
logHelper.error(err, `\n\n${args.join('\n')}`);
throw err;
})
// We must give the generated stream the same name as the entry file
// for the sourcemaps to work correctly
.pipe(source(moduleBrowserPath))
// gulp-sourcemaps don't work with streams so we need
.pipe(buffer())
// This tells gulp-sourcemaps to load the inline sourcemap
.pipe(sourcemaps.init({loadMaps: true}))
// This renames the output file
.pipe(rename(outputFilename))
// This writes the sourcemap alongside the final build file
.pipe(sourcemaps.write('.'))
.pipe(gulp.dest(outputDirectory));
});

// Generate both a native module and a UMD module (for compat).
await Promise.all([
bundle.write({
file: path.join(outputDirectory, esFilename),
sourcemap: true,
format: 'es',
}),
bundle.write({
file: path.join(outputDirectory, umdFilename),
sourcemap: true,
format: 'umd',
name: 'workbox',
}),
]);
};
2 changes: 1 addition & 1 deletion infra/testing/server/routes/build-file.js
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ async function handler(req, res) {
const packagePath = path.join(ROOT_DIR, 'packages', pkg.name);
const buildPath = path.dirname(path.join(packagePath, pkg.main));

let fileName = path.basename(pkg.main);
let fileName = path.basename(pkg.workbox.primaryBuild || pkg.main);

if (buildType) {
fileName = fileName.replace('.prod.', `.${buildType}.`);
Expand Down
Loading