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.

Sign up for GitHub

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

fix(build): Update dependencies and build pipeline #51

Merged
merged 9 commits into from
Dec 28, 2018
Merged

fix(build): Update dependencies and build pipeline #51

Show file tree
Hide file tree
Changes from 3 commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
48acd36
fix(build): Update dependencies and build pipeline
kwelch Dec 27, 2018
ba5adef
lint fix for gulpfile
kwelch Dec 27, 2018
0705144
fix lint in gulp file
kwelch Dec 27, 2018
1f41b07
added missing package
kwelch Dec 27, 2018
5e17342
added missing peerDeps
kwelch Dec 27, 2018
50adfbf
ran eslint fix and added watch plugin to run fix from jest
kwelch Dec 27, 2018
56aa2ff
downgrade typescript to work with eslint
kwelch Dec 27, 2018
c36af62
update import to deconstruct
kwelch Dec 27, 2018
32d0eb2
move babel related deps off beta releases
kwelch Dec 27, 2018
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
81 changes: 44 additions & 37 deletions gulpfile.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,13 +7,14 @@ const replace = require('gulp-replace');
const debug = require('gulp-debug');
const util = require('gulp-util');

const {rollup} = require('rollup');
const { rollup } = require('rollup');
const rollupBabel = require('rollup-plugin-babel');
const rollupNodeResolve = require('rollup-plugin-node-resolve');
const rollupCommonjs = require('rollup-plugin-commonjs');
const rollupJson = require('rollup-plugin-json');
const rollupReplace = require('rollup-plugin-replace');
const rollupUglify = require('rollup-plugin-uglify');
const rollupTypescript = require('rollup-plugin-typescript');
const rollupUglify = require('rollup-plugin-uglify').uglify;
kwelch-eb marked this conversation as resolved.
Show resolved Hide resolved

const FORMAT_ESM = 'esm';
const FORMAT_CJS = 'cjs';
Expand All @@ -28,12 +29,12 @@ const FILES_TO_BUILD = [
'src/**/*.@(ts|js)',

// but exclude the test files
'!src/**/__tests__/**',
'!src/**/__tests__/**'
];

// When transpiling to ES format, we still use the `env` preset
// and we want everything transpiled EXCEPT modules
const ESM_ENV_PRESET = ['@babel/env', {modules: false}];
const ESM_ENV_PRESET = ['@babel/env', { modules: false }];

// When transpiling to UMD, we need the UMD transform plugin.
// Need to explicitly list the globals unfortunately
Expand All @@ -42,27 +43,27 @@ const UMD_TRANSFORM_PLUGIN = [
{
globals: {
index: MODULE_NAME,
'isomorphic-fetch': 'fetch',
'isomorphic-fetch': 'fetch'
},
exactGlobals: true,
},
exactGlobals: true
}
];

const _getBabelConfig = (format) => ({
const _getBabelConfig = format => ({
babelrc: false,

presets: [
format === FORMAT_ESM ? ESM_ENV_PRESET : '@babel/env',
'@babel/typescript',
'@babel/typescript'
],
plugins: [
'@babel/proposal-class-properties',
'@babel/proposal-object-rest-spread',
...(format === FORMAT_UMD ? [UMD_TRANSFORM_PLUGIN] : []),
],
...(format === FORMAT_UMD ? [UMD_TRANSFORM_PLUGIN] : [])
]
});

const _getBabelStream = (format) =>
const _getBabelStream = format =>
gulp
// get a stream of the files to transpile
.src(FILES_TO_BUILD)
Expand All @@ -71,7 +72,7 @@ const _getBabelStream = (format) =>
// do the appropriate babel transpile (this is a copy from package.json)
.pipe(babel(_getBabelConfig(format)));

const _genUmd = ({minify = false} = {}) =>
const _genUmd = ({ minify = false } = {}) =>
_getBabelStream(FORMAT_UMD)
// If you're using UMD, you probably don't have `process.env.NODE_ENV` so, we'll replace it.
// If you're using the unminified UMD, you're probably in DEV
Expand All @@ -84,16 +85,16 @@ const _genUmd = ({minify = false} = {}) =>
)
// minify the files and rename to .min.js extension (when minifying)
.pipe(minify ? uglify() : util.noop())
.pipe(minify ? rename({extname: '.min.js'}) : util.noop())
.pipe(minify ? rename({ extname: '.min.js' }) : util.noop())
.pipe(sourcemaps.write('./'))
.pipe(
debug({
title: minify ? 'Building + Minifying UMD:' : 'Building UMD:',
title: minify ? 'Building + Minifying UMD:' : 'Building UMD:'
})
)
.pipe(gulp.dest('lib/umd'));

const _genDist = ({minify = false} = {}) =>
const _genDist = ({ minify = false } = {}) =>
rollup({
input: SOURCE_ENTRY,

Expand All @@ -103,12 +104,15 @@ const _genDist = ({minify = false} = {}) =>
rollupReplace({
'process.env.NODE_ENV': JSON.stringify(
minify ? 'production' : 'development'
),
)
}),

// convert JSON files to ES6 modules, so they can be included in Rollup bundle
rollupJson(),

// gives rollup ability to read typescript files
rollupTypescript(),
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Interesting! How was this working before????

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I am not really sure about that. It was in out package.json so maybe it was implied.


// Locate modules using the Node resolution algorithm, for using third party modules in node_modules
rollupNodeResolve({
// use "module" field for ES6 module if possible
Expand All @@ -124,13 +128,13 @@ const _genDist = ({minify = false} = {}) =>
browser: true,

// include typescript files as default extensions
extensions: ['.ts', '.js'],
extensions: ['.ts', '.js']
}),

// Convert CommonJS modules to ES6 modules, so they can be included in a Rollup bundle
rollupCommonjs({
// Node modules are the ones we're trying to get it to understand
include: 'node_modules/**',
include: 'node_modules/**'
}),

// Seamless integration between Rollup and Babel
Expand All @@ -141,58 +145,61 @@ const _genDist = ({minify = false} = {}) =>
exclude: 'node_modules/**',

// don't place helpers at the top of the files, but point to reference contained external helpers
externalHelpers: true,
externalHelpers: true
},
_getBabelConfig(FORMAT_ESM)
)
),

// Minify the code if that option is specified
// `false` will get filtered out below
minify && rollupUglify(),
].filter(Boolean),
}).then((bundle) => {
minify && rollupUglify()
].filter(Boolean)
}).then(bundle => {
bundle.write({
format: FORMAT_UMD,
file: `dist/eventbrite${minify ? '.min' : ''}.js`,

// The window global variable name for the package
name: MODULE_NAME,

sourcemap: true,
sourcemap: true
});
});

// Used by modern dependency systems like Webpack or Rollup that can do tree-shaking
gulp.task('build:lib:esm', () =>
_getBabelStream(FORMAT_ESM)
.pipe(debug({title: 'Building ESM:'}))
.pipe(debug({ title: 'Building ESM:' }))
.pipe(gulp.dest('lib/esm'))
);

// Used primarily by Node for resolving dependencies
gulp.task('build:lib:cjs', () =>
_getBabelStream(FORMAT_CJS)
.pipe(debug({title: 'Building CJS'}))
.pipe(debug({ title: 'Building CJS' }))
.pipe(gulp.dest('lib/cjs'))
);

// Used by legacy dependency systems like requireJS
gulp.task('build:dist', () => _genDist());
gulp.task('build:dist:min', () => _genDist({minify: true}));
gulp.task('build:dist:min', () => _genDist({ minify: true }));

// Unclear what would use this over the previous 3, but keeping for now
// May get removed in later releases
gulp.task('build:lib:umd', () => _genUmd());
gulp.task('build:lib:umd:min', () => _genUmd({minify: true}));

gulp.task('build:lib', [
'build:lib:esm',
'build:lib:cjs',
'build:lib:umd',
'build:lib:umd:min',
]);
gulp.task('build:lib:umd:min', () => _genUmd({ minify: true }));

gulp.task(
'build:lib',
gulp.series(
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Oh looks like gulp@4 introduced gulp.series? I'm guessing because there's also a parallel version...

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes I assumed we wanted to use series, but I am open to using parallel.

'build:lib:esm',
'build:lib:cjs',
'build:lib:umd',
'build:lib:umd:min'
)
);

gulp.task('build', ['build:lib', 'build:dist', 'build:dist:min']);
gulp.task('build', gulp.series('build:lib', 'build:dist', 'build:dist:min'));

gulp.task('default', ['build']);
gulp.task('default', gulp.series('build'));
51 changes: 28 additions & 23 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -56,7 +56,7 @@
"babel-core": "^7.0.0-bridge.0"
},
"devDependencies": {
"@babel/cli": "^7.0.0-beta.40",
"@babel/cli": "^7.2.3",
"@babel/core": "^7.0.0-beta.40",
kwelch-eb marked this conversation as resolved.
Show resolved Hide resolved
"@babel/plugin-external-helpers": "^7.0.0-beta.40",
"@babel/plugin-proposal-class-properties": "^7.0.0-beta.40",
Expand All @@ -65,40 +65,40 @@
"@babel/preset-env": "^7.0.0-beta.40",
"@babel/preset-typescript": "^7.0.0-beta.40",
"@types/isomorphic-fetch": "^0.0.34",
"@types/jest": "^22.1.3",
"@types/node": "^9.4.6",
"babel-eslint": "^7.0.0",
"@types/jest": "^23.3.10",
"@types/node": "^10.12.18",
"babel-eslint": "^10.0.1",
"bundlesize": "^0.17.0",
"eslint": "^3.0.0",
"eslint-config-eventbrite": "^4.1.0",
"eslint": "^5.11.1",
"eslint-config-eventbrite": "^5.0.0",
"eslint-plugin-import": "^2.0.0",
"eslint-plugin-typescript": "^0.9.0",
"gulp": "^3.9.1",
"gulp-babel": "^7.0.1",
"eslint-plugin-typescript": "^0.14.0",
"gulp": "^4.0.0",
"gulp-babel": "^8.0.0",
"gulp-debug": "^4.0.0",
"gulp-rename": "^1.2.2",
"gulp-replace": "^0.6.1",
"gulp-replace": "^1.0.0",
"gulp-sourcemaps": "^2.6.4",
"gulp-uglify": "^3.0.0",
"husky": "^0.14.3",
"jest": "^22.4.0",
"jest-runner-eslint": "^0.4.0",
"gulp-util": "^3.0.8",
"husky": "^1.2.1",
"jest": "^23.6.0",
"jest-runner-eslint": "^0.7.1",
"jest-runner-tsc": "^1.2.0",
"lint-staged": "^6.1.0",
"node": "^8.9.2",
kwelch-eb marked this conversation as resolved.
Show resolved Hide resolved
"lint-staged": "^8.1.0",
"npm-run-all": "^4.1.2",
"prettier-eslint-cli": "^4.7.1",
"rollup": "^0.56.3",
"rollup": "^0.68.2",
"rollup-plugin-babel": "^4.0.0-beta.2",
"rollup-plugin-commonjs": "^8.3.0",
"rollup-plugin-json": "^2.3.0",
"rollup-plugin-node-resolve": "^3.0.3",
"rollup-plugin-commonjs": "^9.2.0",
"rollup-plugin-json": "^3.1.0",
"rollup-plugin-node-resolve": "^4.0.0",
"rollup-plugin-replace": "^2.0.0",
"rollup-plugin-typescript": "^0.8.1",
"rollup-plugin-uglify": "^3.0.0",
"typescript": "^2.7.2",
"rollup-plugin-typescript": "^1.0.0",
"rollup-plugin-uglify": "^6.0.0",
"typescript": "^3.2.2",
"typescript-babel-jest": "^1.0.5",
"typescript-eslint-parser": "^14.0.0"
"typescript-eslint-parser": "^21.0.2"
},
"bundlesize": [
{
Expand All @@ -112,5 +112,10 @@
"jest-lint.config.js",
"jest-tsc.config.js"
]
},
"prettier": {
"tabWidth": 4,
"semi": true,
"singleQuote": true
}
}
Loading