Skip to content

Commit fedfbe3

Browse files
christianalfoniCompuIves
christianalfoni
authored and
CompuIves
committed
Convert to Babel 7 (codesandbox#1103)
1 parent 746d9bb commit fedfbe3

File tree

27 files changed

+6255
-512
lines changed

27 files changed

+6255
-512
lines changed

‎.babelrc‎

Lines changed: 11 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,20 @@
11
{
22
"env": {
33
"test": {
4-
"presets": ["env", "react"],
4+
"presets": [
5+
"@babel/preset-env",
6+
"@babel/preset-flow",
7+
"@babel/preset-react"
8+
],
59
"plugins": [
6-
"babel-plugin-transform-async-to-generator",
7-
"babel-plugin-transform-object-rest-spread",
8-
"babel-plugin-transform-class-properties",
9-
"babel-plugin-transform-runtime",
10-
"babel-plugin-syntax-dynamic-import",
10+
"@babel/plugin-transform-async-to-generator",
11+
"@babel/plugin-proposal-object-rest-spread",
12+
"@babel/plugin-proposal-class-properties",
13+
"@babel/plugin-transform-runtime",
14+
"@babel/plugin-syntax-dynamic-import",
1115
"babel-plugin-lodash",
1216
"babel-plugin-system-import-transformer",
13-
"babel-macros"
17+
"babel-plugin-macros"
1418
]
1519
}
1620
}

‎packages/app/babel.config.js‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
module.exports = {
2+
env: {
3+
test: {
4+
presets: [
5+
'@babel/preset-env',
6+
'@babel/preset-flow',
7+
'@babel/preset-react',
8+
],
9+
plugins: [
10+
'@babel/plugin-transform-destructuring',
11+
'@babel/plugin-transform-async-to-generator',
12+
'@babel/plugin-proposal-object-rest-spread',
13+
'@babel/plugin-proposal-class-properties',
14+
'@babel/plugin-transform-runtime',
15+
'@babel/plugin-syntax-dynamic-import',
16+
'babel-plugin-lodash',
17+
'babel-plugin-system-import-transformer',
18+
'babel-plugin-macros',
19+
],
20+
},
21+
},
22+
};

‎packages/app/config/babel.dev.js‎

Lines changed: 11 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -6,37 +6,33 @@ module.exports = {
66
cacheDirectory: true,
77
presets: [
88
// Latest stable ECMAScript features
9+
require.resolve('@babel/preset-flow'),
910
[
10-
'env',
11+
require.resolve('@babel/preset-env'),
1112
{
1213
targets: {
1314
chrome: 67,
1415
// We currently minify with uglify
1516
// Remove after https://github.com/mishoo/UglifyJS2/issues/448
16-
uglify: true,
1717
},
1818
// Disable polyfill transforms
1919
useBuiltIns: false,
2020
modules: false,
21+
forceAllTransforms: true,
2122
},
2223
],
2324
// JSX, Flow
24-
'react',
25+
require.resolve('@babel/preset-react'),
2526
],
2627
plugins: [
27-
require.resolve('babel-plugin-transform-object-rest-spread'),
28-
require.resolve('babel-plugin-transform-class-properties'),
29-
require.resolve('babel-plugin-transform-runtime'),
28+
require.resolve('@babel/plugin-transform-template-literals'),
29+
require.resolve('@babel/plugin-transform-destructuring'),
30+
require.resolve('@babel/plugin-proposal-object-rest-spread'),
31+
require.resolve('@babel/plugin-proposal-class-properties'),
32+
require.resolve('@babel/plugin-transform-runtime'),
3033
require.resolve('babel-plugin-lodash'),
31-
require.resolve('babel-plugin-syntax-dynamic-import'),
34+
require.resolve('@babel/plugin-syntax-dynamic-import'),
3235
require.resolve('babel-plugin-styled-components'),
33-
require.resolve('babel-macros'),
34-
[
35-
require.resolve('react-loadable/babel'),
36-
{
37-
server: true,
38-
webpack: true,
39-
},
40-
],
36+
require.resolve('babel-plugin-macros'),
4137
],
4238
};

‎packages/app/config/babel.prod.js‎

Lines changed: 33 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -4,45 +4,60 @@ module.exports = {
44
// Don't try to find .babelrc because we want to force this configuration.
55
babelrc: false,
66
presets: [
7+
require.resolve('@babel/preset-flow'),
78
// Latest stable ECMAScript features
89
[
9-
'env',
10+
require.resolve('@babel/preset-env'),
1011
{
1112
targets: {
1213
ie: 11,
13-
// We currently minify with uglify
14-
// Remove after https://github.com/mishoo/UglifyJS2/issues/448
15-
uglify: true,
1614
},
1715
// Disable polyfill transforms
1816
useBuiltIns: false,
1917
modules: false,
18+
forceAllTransforms: true,
2019
},
2120
],
2221
// JSX, Flow
23-
'react',
22+
require.resolve('@babel/preset-react'),
2423
],
2524
plugins: [
26-
require.resolve('babel-plugin-transform-async-to-generator'),
27-
require.resolve('babel-plugin-transform-object-rest-spread'),
28-
require.resolve('babel-plugin-transform-class-properties'),
29-
require.resolve('babel-plugin-transform-runtime'),
25+
require.resolve('@babel/plugin-transform-template-literals'),
26+
require.resolve('@babel/plugin-transform-destructuring'),
27+
require.resolve('@babel/plugin-transform-async-to-generator'),
28+
require.resolve('@babel/plugin-proposal-object-rest-spread'),
29+
require.resolve('@babel/plugin-proposal-class-properties'),
30+
require.resolve('@babel/plugin-transform-runtime'),
3031
require.resolve('babel-plugin-lodash'),
31-
require.resolve('babel-plugin-syntax-dynamic-import'),
32+
require.resolve('@babel/plugin-syntax-dynamic-import'),
3233
require.resolve('babel-plugin-styled-components'),
33-
require.resolve('babel-macros'),
34-
[
35-
require.resolve('react-loadable/babel'),
36-
{
37-
server: true,
38-
webpack: true,
39-
},
40-
],
34+
require.resolve('babel-plugin-macros'),
4135
// Optimization: hoist JSX that never changes out of render()
4236
// Disabled because of issues:
4337
// * https://github.com/facebookincubator/create-react-app/issues/525
4438
// * https://phabricator.babeljs.io/search/query/pCNlnC2xzwzx/
4539
// TODO: Enable again when these issues are resolved.
4640
// require.resolve('babel-plugin-transform-react-constant-elements')
4741
],
42+
overrides: [
43+
{
44+
test: ['../src/sandbox'],
45+
presets: [
46+
require.resolve('@babel/preset-flow'),
47+
// Latest stable ECMAScript features
48+
[
49+
require.resolve('@babel/preset-env'),
50+
{
51+
targets: {
52+
ie: 11,
53+
},
54+
// Disable polyfill transforms
55+
useBuiltIns: false,
56+
modules: false,
57+
forceAllTransforms: true,
58+
},
59+
],
60+
],
61+
},
62+
],
4863
};

‎packages/app/config/polyfills.js‎

Lines changed: 13 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,21 @@
1+
const g = typeof window === 'undefined' ? self : window;
2+
13
if (typeof Promise === 'undefined') {
24
// Rejection tracking prevents a common issue where React gets into an
35
// inconsistent state due to an error, but it gets swallowed by a Promise,
46
// and the user has no idea what causes React's erratic future behavior.
57
require('promise/lib/rejection-tracking').enable();
6-
window.Promise = require('promise/lib/es6-extensions.js');
8+
g.Promise = require('promise/lib/es6-extensions.js');
79
}
810

911
// fetch() polyfill for making API calls.
1012
require('whatwg-fetch');
1113

12-
// Object.assign() is commonly used with React.
13-
// It will use the native implementation if it's present and isn't buggy.
14-
Object.assign = require('object-assign');
15-
16-
window.cosmiconfig = {};
17-
window.prettier = {};
18-
window.jsdom = {
14+
g.cosmiconfig = {};
15+
g.prettier = {};
16+
g.jsdom = {
1917
JSDOM: {
20-
fragment(htmlString) {
18+
fragment: function(htmlString) {
2119
const div = document.createElement('div');
2220
div.innerHTML = htmlString.trim();
2321

@@ -26,3 +24,9 @@ window.jsdom = {
2624
},
2725
},
2826
};
27+
28+
// IE11
29+
require('core-js/fn/array/find');
30+
require('core-js/fn/array/from');
31+
require('core-js/fn/object/assign');
32+
require('core-js/fn/symbol');

‎packages/app/config/webpack.common.js‎

Lines changed: 26 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -65,10 +65,7 @@ module.exports = {
6565
require.resolve('./polyfills'),
6666
path.join(paths.appSrc, 'index.js'),
6767
],
68-
sandbox: [
69-
require.resolve('./polyfills'),
70-
path.join(paths.sandboxSrc, 'index.js'),
71-
],
68+
sandbox: [path.join(paths.sandboxSrc, 'index.js')],
7269
'sandbox-startup': path.join(paths.sandboxSrc, 'startup.js'),
7370
embed: [
7471
require.resolve('./polyfills'),
@@ -97,26 +94,18 @@ module.exports = {
9794
loader: 'file-loader',
9895
type: 'javascript/auto',
9996
},
100-
{
101-
test: /\.js$/,
102-
include: [paths.src, paths.common, /@emmetio/],
103-
exclude: [
104-
/eslint\.4\.1\.0\.min\.js$/,
105-
/typescriptServices\.js$/,
106-
/\.no-webpack\./,
107-
],
108-
loader: 'happypack/loader',
109-
},
110-
11197
// Transpile node dependencies, node deps are often not transpiled for IE11
11298
{
11399
test: [
114100
new RegExp(`${sepRe}node_modules${sepRe}.*ansi-styles`),
115101
new RegExp(`${sepRe}node_modules${sepRe}.*chalk`),
116102
new RegExp(`${sepRe}node_modules${sepRe}.*jest`),
117-
new RegExp(`sandbox-hooks`),
118103
new RegExp(`${sepRe}node_modules${sepRe}.*monaco-textmate`),
119104
new RegExp(`${sepRe}node_modules${sepRe}.*onigasm`),
105+
new RegExp(`react-icons`),
106+
new RegExp(`${sepRe}node_modules${sepRe}.*gsap`),
107+
new RegExp(`${sepRe}node_modules${sepRe}.*babel-plugin-macros`),
108+
new RegExp(`sandbox-hooks`),
120109
new RegExp(
121110
`${sepRe}node_modules${sepRe}vue-template-es2015-compiler`
122111
),
@@ -127,25 +116,40 @@ module.exports = {
127116
loader: 'babel-loader',
128117
query: {
129118
presets: [
119+
'@babel/preset-flow',
130120
[
131-
'env',
121+
'@babel/preset-env',
132122
{
133123
targets: {
134124
ie: 11,
135125
esmodules: true,
136126
},
127+
modules: 'umd',
128+
useBuiltIns: false,
137129
},
138130
],
139-
'react',
131+
'@babel/preset-react',
140132
],
141133
plugins: [
142-
'transform-async-to-generator',
143-
'transform-object-rest-spread',
144-
'transform-class-properties',
145-
'transform-runtime',
134+
'@babel/plugin-transform-template-literals',
135+
'@babel/plugin-transform-destructuring',
136+
'@babel/plugin-transform-async-to-generator',
137+
'@babel/plugin-proposal-object-rest-spread',
138+
'@babel/plugin-proposal-class-properties',
139+
'@babel/plugin-transform-runtime',
146140
],
147141
},
148142
},
143+
{
144+
test: /\.js$/,
145+
include: [paths.src, paths.common, /@emmetio/],
146+
exclude: [
147+
/eslint\.4\.1\.0\.min\.js$/,
148+
/typescriptServices\.js$/,
149+
/\.no-webpack\./,
150+
],
151+
loader: 'happypack/loader',
152+
},
149153

150154
// `eslint-plugin-vue/lib/index.js` depends on `fs` module we cannot use in browsers, so needs shimming.
151155
{

‎packages/app/integration-tests/browser-tests/browsers.test.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ function getCapabilities(browserInfo) {
1010
'browserstack.user': process.env.BROWSER_STACK_USER,
1111
'browserstack.key': process.env.BROWSER_STACK_KEY,
1212
'browserstack.local': 'true',
13+
'browserstack.debug': 'true',
1314
'browserstack.console': 'errors',
1415
'browserstack.networkLogs': true,
1516
build: hash,

0 commit comments

Comments
 (0)