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

Jump to bottom

Babel 7 #16297

Merged
merged 15 commits into from
Aug 9, 2019
Merged

Babel 7 #16297

Show file tree
Hide file tree
Changes from 10 commits
Commits
Show all changes
15 commits
Select commit Hold shift + click to select a range
ecd1734
initial babel stuff
lunaruan Aug 5, 2019
ea8022d
blah
lunaruan Aug 5, 2019
988d630
Merge branch 'master' of https://github.com/facebook/react into upgra…
lunaruan Aug 6, 2019
d73c6eb
deleted class transform
lunaruan Aug 6, 2019
aecac62
add plugin transform classes
lunaruan Aug 6, 2019
fc409b6
cleaned up babel config and code, fixed issue where extra functions w…
lunaruan Aug 6, 2019
c9c99fc
fixed ReactFreshBabelPlugin tests
lunaruan Aug 6, 2019
1c233d6
update react fresh test
lunaruan Aug 7, 2019
88eeb24
updated options for babel/plugin-proposal-class-properties to replica…
lunaruan Aug 7, 2019
df8856c
cleaned up code
lunaruan Aug 7, 2019
79f3507
modified ReactFreshBabelPlugin and switched to using only babel plugins
lunaruan Aug 8, 2019
faa6e32
fixed jest config.source-persistent.js
lunaruan Aug 8, 2019
4b02b0f
remove babel-jest
lunaruan Aug 8, 2019
2e07a65
removed transform-react-display-name
lunaruan Aug 9, 2019
348fae3
Merge branch 'master' of https://github.com/facebook/react into upgra…
lunaruan Aug 9, 2019
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
23 changes: 0 additions & 23 deletions .babelrc
View file
Open in desktop

This file was deleted.

25 changes: 25 additions & 0 deletions babel.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
'use strict';

module.exports = {
presets: ['@babel/preset-react', '@babel/preset-flow'],
Copy link
Collaborator

@acdlite acdlite Aug 7, 2019 •
edited
Loading

Choose a reason for hiding this comment

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

Can we remove these presets and use the plugins directly? That way unexpected stuff can't sneak in.

plugins: [
['@babel/plugin-proposal-class-properties', {loose: true}],
'syntax-trailing-function-commas',
[
'@babel/plugin-proposal-object-rest-spread',
{loose: true, useBuiltIns: true},
],
['@babel/plugin-transform-template-literals', {loose: true}],
'@babel/plugin-transform-literals',
'@babel/plugin-transform-arrow-functions',
'@babel/plugin-transform-block-scoped-functions',
'@babel/plugin-transform-object-super',
'@babel/plugin-transform-shorthand-properties',
'@babel/plugin-transform-computed-properties',
'@babel/plugin-transform-for-of',
['@babel/plugin-transform-spread', {loose: true, useBuiltIns: true}],
'@babel/plugin-transform-parameters',
['@babel/plugin-transform-destructuring', {loose: true, useBuiltIns: true}],
['@babel/plugin-transform-block-scoping', {throwIfClosureRequired: true}],
],
};
60 changes: 30 additions & 30 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,38 +4,38 @@
"packages/*"
],
"devDependencies": {
"@babel/cli": "^7.0.0",
"@babel/code-frame": "^7.0.0",
"@babel/core": "^7.0.0",
"@babel/helper-module-imports": "^7.0.0",
"@babel/plugin-external-helpers": "^7.0.0",
"@babel/plugin-proposal-class-properties": "^7.0.0",
"@babel/plugin-proposal-object-rest-spread": "^7.0.0",
"@babel/plugin-syntax-dynamic-import": "^7.0.0",
"@babel/plugin-transform-arrow-functions": "^7.0.0",
"@babel/plugin-transform-async-to-generator": "^7.0.0",
"@babel/plugin-transform-block-scoped-functions": "^7.0.0",
"@babel/plugin-transform-block-scoping": "^7.0.0",
"@babel/plugin-transform-classes": "^7.0.0",
"@babel/plugin-transform-computed-properties": "^7.0.0",
"@babel/plugin-transform-destructuring": "^7.0.0",
"@babel/plugin-transform-for-of": "^7.0.0",
"@babel/plugin-transform-literals": "^7.0.0",
"@babel/plugin-transform-modules-commonjs": "^7.0.0",
"@babel/plugin-transform-object-super": "^7.0.0",
"@babel/plugin-transform-parameters": "^7.0.0",
"@babel/plugin-transform-react-jsx-source": "^7.0.0",
"@babel/plugin-transform-shorthand-properties": "^7.0.0",
"@babel/plugin-transform-spread": "^7.0.0",
"@babel/plugin-transform-template-literals": "^7.0.0",
"@babel/preset-flow": "^7.0.0",
"@babel/preset-react": "^7.0.0",
"@babel/traverse": "^7.0.0",
"@mattiasbuelens/web-streams-polyfill": "0.1.0",
"art": "^0.10.1",
"babel-cli": "^6.6.5",
"babel-code-frame": "^6.26.0",
"babel-core": "^6.0.0",
"babel-eslint": "^10.0.0",
"babel-jest": "^23.0.1",
"babel-plugin-check-es2015-constants": "^6.5.0",
"babel-plugin-external-helpers": "^6.22.0",
"babel-plugin-syntax-dynamic-import": "^6.18.0",
"babel-jest": "^24.8.0",
Copy link
Contributor

Choose a reason for hiding this comment

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

you can remove babel-jest entirely, it's not used

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Will do. Thanks!

"babel-plugin-syntax-trailing-function-commas": "^6.5.0",
"babel-plugin-transform-async-to-generator": "^6.22.0",
"babel-plugin-transform-class-properties": "^6.11.5",
"babel-plugin-transform-es2015-arrow-functions": "^6.5.2",
"babel-plugin-transform-es2015-block-scoped-functions": "^6.5.0",
"babel-plugin-transform-es2015-block-scoping": "^6.23.0",
"babel-plugin-transform-es2015-classes": "^6.5.2",
"babel-plugin-transform-es2015-computed-properties": "^6.5.2",
"babel-plugin-transform-es2015-destructuring": "^6.5.0",
"babel-plugin-transform-es2015-for-of": "^6.5.2",
"babel-plugin-transform-es2015-literals": "^6.5.0",
"babel-plugin-transform-es2015-modules-commonjs": "^6.5.2",
"babel-plugin-transform-es2015-object-super": "^6.5.0",
"babel-plugin-transform-es2015-parameters": "^6.5.0",
"babel-plugin-transform-es2015-shorthand-properties": "^6.5.0",
"babel-plugin-transform-es2015-spread": "^6.5.2",
"babel-plugin-transform-es2015-template-literals": "^6.5.2",
"babel-plugin-transform-object-rest-spread": "^6.6.5",
"babel-plugin-transform-react-jsx-source": "^6.8.0",
"babel-plugin-transform-regenerator": "^6.26.0",
"babel-preset-react": "^6.5.0",
"babel-traverse": "^6.9.0",
"babylon": "6.18.0",
"chalk": "^1.1.3",
"cli-table": "^0.3.1",
Expand All @@ -53,7 +53,7 @@
"eslint-plugin-jest": "^21.6.1",
"eslint-plugin-no-for-of-loops": "^1.0.0",
"eslint-plugin-react": "^6.7.1",
"eslint-plugin-react-internal": "link:./scripts/eslint-rules/",
"eslint-plugin-react-internal": "link:./scripts/eslint-rules",
"fbjs-scripts": "^0.8.3",
"filesize": "^3.5.6",
"flow-bin": "^0.72.0",
Expand All @@ -76,7 +76,7 @@
"react-lifecycles-compat": "^3.0.2",
"rimraf": "^2.6.1",
"rollup": "^0.52.1",
"rollup-plugin-babel": "^3.0.1",
"rollup-plugin-babel": "^4.0.1",
"rollup-plugin-commonjs": "^8.2.6",
"rollup-plugin-node-resolve": "^2.1.1",
"rollup-plugin-prettier": "^0.3.0",
Expand Down
35 changes: 32 additions & 3 deletions packages/react-refresh/src/__tests__/ReactFreshBabelPlugin-test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,25 +7,54 @@

'use strict';

let babel = require('babel-core');
let babel = require('@babel/core');
let {wrap} = require('jest-snapshot-serializer-raw');
let freshPlugin = require('react-refresh/babel');

function transform(input, options = {}) {
return wrap(
babel.transform(input, {
babelrc: false,
configFile: false,
plugins: [
'syntax-jsx',
'syntax-dynamic-import',
'@babel/syntax-jsx',
'@babel/syntax-dynamic-import',
freshPlugin,
...(options.plugins || []),
],
}).code,
);
}

const oldEnv = babel.getEnv();
describe('ReactFreshBabelPlugin', () => {
beforeEach(() => {
Copy link
Collaborator

@acdlite acdlite Aug 7, 2019 •
edited
Loading

Choose a reason for hiding this comment

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

The reason Fresh throws an error if you're not in development environment is because the production build of React does not support hot reloading. React uses a process.env.NODE_ENV check (that's what __DEV__ compiles to), not BABEL_ENV. Technically, BABEL_ENV and NODE_ENV could be different, even though they're usually the same.

We should use __DEV__/NODE_ENV since that's what determines the version of React DOM.

if (__DEV__) {
  // The tests
} else {
  it('throw error if environment is not development', ...);
}

process.env.BABEL_ENV = 'development';
});

afterEach(() => {
process.env.BABEL_ENV = oldEnv;
});

it('thorw error if environment is not development', () => {
process.env.BABEL_ENV = 'production';

let error;
try {
transform(`function Hello() {}`);
} catch (transformError) {
error = transformError;
}
expect(error).toEqual(
new Error(
'[BABEL] unknown: React Refresh Babel transform should only be enabled ' +
'in development environment. Instead, the environment is: "' +
process.env.BABEL_ENV +
'". (While processing: "base$2")',
),
);
});

it('registers top-level function declarations', () => {
// Hello and Bar should be registered, handleClick shouldn't.
expect(
Expand Down
8 changes: 4 additions & 4 deletions packages/react-refresh/src/__tests__/ReactFreshIntegration-test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ let ReactDOM;
let ReactFreshRuntime;
let act;

let babel = require('babel-core');
let babel = require('@babel/core');
let freshPlugin = require('react-refresh/babel');

describe('ReactFreshIntegration', () => {
Expand Down Expand Up @@ -58,11 +58,11 @@ describe('ReactFreshIntegration', () => {
function execute(source) {
const compiled = babel.transform(source, {
babelrc: false,
presets: ['react'],
presets: ['@babel/react'],
plugins: [
freshPlugin,
'transform-es2015-modules-commonjs',
compileDestructuring && 'transform-es2015-destructuring',
'@babel/plugin-transform-modules-commonjs',
compileDestructuring && '@babel/plugin-transform-destructuring',
].filter(Boolean),
}).code;
exportsObj = {};
Expand Down
Loading