Skip to content

Reuse babel options and specify polyfills for karma explicitely #1456

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

Merged
kof merged 18 commits into from
Mar 11, 2021
Merged

Reuse babel options and specify polyfills for karma explicitely #1456

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
18 commits
Select commit Hold shift + click to select a range
73facad
reuse babel options
kof Feb 17, 2021
48e8aad
add envioronment requirements
kof Feb 17, 2021
9e467e7
manually serialize a collection, because with ['@babel/env', {loose: …
kof Feb 17, 2021
a932be7
avoid requiring polyfill for IE11
kof Feb 18, 2021
17d4f74
make it clear that adding new polyfills to JSS implicite dependencies…
kof Feb 18, 2021
1f60896
use specific polyfills
kof Mar 10, 2021
505b43d
build
kof Mar 10, 2021
0763e98
add function name polyfill for IE9
kof Mar 11, 2021
c571489
add raf polyfill
kof Mar 11, 2021
8639266
revert changes to yarn.lock
kof Mar 11, 2021
7c1ce10
add core-js and remove babel-polyfill from yarn
kof Mar 11, 2021
ec948c7
Merge branch 'master' into reuse-babel-options
kof Mar 11, 2021
4daeb30
update snapshots after merge
kof Mar 11, 2021
0533333
prettier
kof Mar 11, 2021
881e099
for in doesn't work on on collections in safari 7,8
kof Mar 11, 2021
55c8f16
update environments description
kof Mar 11, 2021
c0a4db4
link environment-requirements
kof Mar 11, 2021
a16a2a8
remove plugin-proposal-export-namespace-from
kof Mar 11, 2021
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
9 changes: 9 additions & 0 deletions babelOptions.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
exports.getBabelOptions = ({useESModules}) => ({
Copy link
Copy Markdown
Member

@TrySound TrySound Feb 17, 2021

Choose a reason for hiding this comment

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

Do you remember why we didn't use babel.config.js?

Copy link
Copy Markdown
Member Author

@kof kof Feb 17, 2021

Choose a reason for hiding this comment

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

no, but I would guess the useESModules option is dynamic, that's why?

Copy link
Copy Markdown
Member

@TrySound TrySound Feb 17, 2021

Choose a reason for hiding this comment

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

Yes, but it can be used only for rollup. There is no difference between inlined and imported helpers.

Copy link
Copy Markdown
Member Author

@kof kof Mar 11, 2021

Choose a reason for hiding this comment

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

using the option for rollup only is fine, it's still better than having the entire babel config duplicted

Copy link
Copy Markdown
Member

@TrySound TrySound Mar 11, 2021

Choose a reason for hiding this comment

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

Btw, babel 7.13 does not require useESModules flag anymore. Right version is detected automatically.

Copy link
Copy Markdown
Member Author

@kof kof Mar 11, 2021

Choose a reason for hiding this comment

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

then we can remove the flag along with upgrading babel, probably better separately

presets: [['@babel/env', {loose: true}], '@babel/flow', '@babel/react'],
plugins: [
['@babel/proposal-class-properties', {loose: true}],
['@babel/transform-runtime', {useESModules}],
['@babel/plugin-proposal-export-namespace-from'],
Copy link
Copy Markdown
Member

@TrySound TrySound Feb 17, 2021

Choose a reason for hiding this comment

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

Is this plugin actually used?

Copy link
Copy Markdown
Member Author

@kof kof Feb 17, 2021

Choose a reason for hiding this comment

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

I searched for export * as - nothing found

Copy link
Copy Markdown
Member Author

@kof kof Mar 11, 2021

Choose a reason for hiding this comment

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

I guess we can remove it

['dev-expression']
]
})
3 changes: 0 additions & 3 deletions karma.conf.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,14 +17,11 @@ module.exports = config => {
frameworks: ['mocha'],
files: [
'node_modules/@babel/polyfill/dist/polyfill.js',
'node_modules/raf/polyfill.js',

'./packages/*/tests/*.js',
'./packages/*/tests/**/*.js',
'./packages/*/src/**/*.test.js'
],
preprocessors: {
'node_modules/raf/polyfill.js': ['webpack'],
'./packages/**/*.js': ['webpack', 'sourcemap']
},
webpack,
Expand Down
21 changes: 8 additions & 13 deletions rollup.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import {terser} from 'rollup-plugin-terser'
import {sizeSnapshot} from 'rollup-plugin-size-snapshot'
import camelCase from 'camelcase'

const {getBabelOptions} = require('./babelOptions')
const getPackageJson = require('./scripts/get-package-json')

const pkg = getPackageJson()
Expand All @@ -33,18 +34,12 @@ Object.keys(pkg.peerDependencies || {}).forEach(key => {

const external = id => !id.startsWith('.') && !path.isAbsolute(id)

const getBabelOptions = ({useESModules}) => ({
const getBabelConfig = ({useESModules}) => ({
babelHelpers: 'runtime',
exclude: /node_modules/,
babelrc: false,
configFile: false,
presets: [['@babel/env', {loose: true}], '@babel/flow', '@babel/react'],
plugins: [
['@babel/proposal-class-properties', {loose: true}],
['@babel/transform-runtime', {useESModules}],
['@babel/plugin-proposal-export-namespace-from'],
['dev-expression']
]
...getBabelOptions({useESModules})
})

const commonjsOptions = {
Expand Down Expand Up @@ -85,7 +80,7 @@ export default [
external: Object.keys(globals),
plugins: [
nodeResolve(),
babel(getBabelOptions({useESModules: true})),
babel(getBabelConfig({useESModules: true})),
commonjs(commonjsOptions),
replace({
'process.env.NODE_ENV': JSON.stringify('development'),
Expand All @@ -107,7 +102,7 @@ export default [
external: Object.keys(globals),
plugins: [
nodeResolve(),
babel(getBabelOptions({useESModules: true})),
babel(getBabelConfig({useESModules: true})),
commonjs(commonjsOptions),
replace({
'process.env.NODE_ENV': JSON.stringify('production'),
Expand All @@ -124,7 +119,7 @@ export default [
external,
plugins: [
createFlowBundlePlugin,
babel(getBabelOptions({useESModules: false})),
babel(getBabelConfig({useESModules: false})),
replace({'process.env.VERSION': JSON.stringify(pkg.version)}),
sizeSnapshot(snapshotOptions)
]
Expand All @@ -135,7 +130,7 @@ export default [
output: {file: pkg.module, format: 'esm'},
external,
plugins: [
babel(getBabelOptions({useESModules: true})),
babel(getBabelConfig({useESModules: true})),
replace({'process.env.VERSION': JSON.stringify(pkg.version)}),
sizeSnapshot(snapshotOptions)
]
Expand All @@ -146,7 +141,7 @@ export default [
output: {file: pkg.unpkg, format: 'esm'},
plugins: [
nodeResolve(),
babel(getBabelOptions({useESModules: true})),
babel(getBabelConfig({useESModules: true})),
commonjs(commonjsOptions),
replace({
'process.env.NODE_ENV': JSON.stringify('development'),
Expand Down
6 changes: 2 additions & 4 deletions webpack.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@

const webpack = require('webpack')
const lerna = require('./lerna.json')
const {getBabelOptions} = require('./babelOptions')

const plugins = [
new webpack.DefinePlugin({
Expand All @@ -29,10 +30,7 @@ module.exports = {
loader: 'babel-loader',
test: /\.js$/,
exclude: /node_modules/,
options: {
presets: ['@babel/react', '@babel/flow', '@babel/env'],
plugins: ['@babel/proposal-class-properties', '@babel/proposal-object-rest-spread']
}
options: getBabelOptions({useESModules: true})
}
]
},
Expand Down
⚡