chore(babel): switch to Babel in distribution #1404
Conversation
Codecov Report
@@ Coverage Diff @@
## master #1404 +/- ##
=======================================
Coverage 73.63% 73.63%
=======================================
Files 808 808
Lines 6092 6092
Branches 1755 1755
=======================================
Hits 4486 4486
Misses 1601 1601
Partials 5 5
Continue to review full report at Codecov.
|
layershifter
changed the title
Changed dependencies in
Changed dependencies in
Changed dependencies in
Changed dependencies in
Changed dependencies in
Changed dependencies in
Changed dependencies in
Generated by 🚫 dangerJS |
layershifter
requested review from
dvdzkwsk,
kuzhelov,
levithomason,
miroslavstastny and
mnajdova
as code owners
Bundle size
|
|
nit: for bundle size stat in description, it will be more representative to share decrease in |
There was a problem hiding this comment.
As this is announced as a concluding step for Babel transition, would like to point out that there is a regression we currently have in comparison to the original TS-based setup: currently our .ts config files are not checked for type safety before executed.
This may introduce problems for rename refactorings, especially, when it is about changing the variable names that contain path values. We should ensure that our config code will be checked for type correctness before being executed - behavior we've had before.
Lets file an issue for that, to keep this piece of work tracked.
| @@ -23,8 +28,10 @@ module.exports = api => { | |||
| const plugins = [ | |||
| '@babel/plugin-proposal-class-properties', | |||
| '@babel/plugin-syntax-dynamic-import', | |||
| '@babel/plugin-transform-runtime', | |||
| ] | |||
| ['@babel/plugin-transform-runtime', { corejs: false, useESModules }], | |||
There was a problem hiding this comment.
false is the default value for corejs option, seems that we can omit it
| } | ||
|
|
||
| module.exports = api => { | ||
| const isNode = api.caller(isBabelRegister) || api.caller(isJest) | ||
| const isDistBuild = api.caller(isDistCaller) |
There was a problem hiding this comment.
nit: probably, isDistBundle name will better reflect semantics and related optimizations applied for this scenario
Fixes #508.
This PR is a final step in Babel migration and aims to improve and simplify our bundling, too.
Use
gulp-babelNow we use
gulp-babelto transpile files.Switch to
@babel/runtimeAs we switched to Babel, we also replaced
tslibwith@babel/runtime.why
@babel/runtimeover@babel/runtime-corejs*?It's commonly used by other libraries:
babel-plugin-lodashThis PR also introduces the first babel plugin that aims to optimize bundle size. Lodash is CJS and can't be treeshaked, it means that
import _ from 'lodash'will include the whole library (70 Kb) 😭This plugin will transform
import _ from 'lodash'toimport _map from 'lodash/map'where_mapis module required in your file.Bundle size
Benefits in bundle size are received from decreasing
lodash: from97Kbto51Kb.@stardust-ui/react-proptypes@stardust-ui/react-component-refIncludes
@stardust-ui/react-proptypes: we definitely need to perform advanced optimizations like this https://github.com/airbnb/prop-types/blob/master/index.js.@stardust-ui/reactAbout increase of main package:
self@0.32- 448KB vsself@0.33- 536KB