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

Multiple Build Types (commonjs, es, and UMD) and other build setup updates #43

Open
wants to merge 3 commits into
base: master
Choose a base branch
from

Conversation

prescottprue
Copy link
Contributor

@prescottprue prescottprue commented Sep 7, 2017

This is a lot of stuff, so feel free to comment on any of it that you are unsure of.

Features

  • Multiple versions now being built:
    • commonjs - npm run build:commonjs - module parameter of package.json now points to this version
    • es - npm run build:es
    • umd (webpack) - npm run build:umd
    • minified umd (webpack with minification) - npm run build:umd:min
  • Webpack 3 🎊
  • Comments removed from all builds (comments: false in babel config)
  • Size reduction of umd (wepacked) build (comments removed, webpack 3 setup)
  • dist folder ignored
  • UMD version is smaller (32.9kb instead of 35.6kb) and now includes a minified version which is only 11.4kb (see size comparison below for more details)
  • Includes setup + instructions for using unpkg cdn
  • watch now rebuilds commonjs build instead of umd build (commonjs is most common)

Reasoning

  • Drastically decreases size that is loaded when using within a project built using Webpack (commonjs version without comments is used instead of UMD)
  • Stack traces + Line Numbers actually make sense (using commonjs over UMD)
  • UMD version includes minified version since it is most commonly used in the browser
  • Those using react-selectable in the browser can use the unpkg CDN, and it points to a minified version (11.4kb vs 35.6kb)
  • Those using esnext can require a version that has not been modularized (es version)
  • dist folder does not need to be tracked in git (it will still be released to npm), and adding it to the .gitignore makes diffs more clear - Ignore dist folder #41
  • Similar setup is common to some of the most popular libraries such as redux to allow for maximum flexibility

Size Comparison

Was
image

Is Now

image

Scott Prue added 2 commits September 6, 2017 18:39
* Webpack 3
* Multiple versions now being built:
  * commonjs - `npm run build:commonjs`
  * es - `npm run build:es`
  * umd (webpack) - `npm run build:umd`
  * minified umd (webpack with minification) - `npm run build:umd:min`
* Comments removed from all built versions (comments: false in babel
config)
* Size reduction of umd (wepacked) version (comments removed, webpack 3
setup)
* dist folder ignored
@prescottprue prescottprue changed the title Build Multiple Versions (commonjs, es, and UMD) and other build setup updates Multiple Build Types (commonjs, es, and UMD) and other build setup updates Sep 7, 2017
@prescottprue prescottprue mentioned this pull request Sep 7, 2017
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

1 participant