commit 9f565769b4eb3231380b1fccd798089b461d0849
parent 2e28dfc97175aacd5e0db7408ce21ec6992393f9
Author: Konstantin Tarkus <hello@tarkus.me>
Date: Wed, 18 Nov 2015 19:47:31 +0300
Upgrade Babel to v6.x
Diffstat:
20 files changed, 89 insertions(+), 87 deletions(-)
diff --git a/.babelrc b/.babelrc
@@ -1,3 +1,10 @@
{
- "stage": 0
-}
-\ No newline at end of file
+ "presets": [
+ "es2015",
+ "stage-0",
+ "react"
+ ],
+ "plugins": [
+ "transform-runtime"
+ ]
+}
diff --git a/package.json b/package.json
@@ -5,7 +5,8 @@
"npm": ">=3.3 <4"
},
"dependencies": {
- "babel-core": "5.8.34",
+ "babel-polyfill": "^6.3.14",
+ "babel-runtime": "^6.3.19",
"bluebird": "3.1.1",
"classnames": "2.2.1",
"eventemitter3": "1.1.1",
@@ -26,10 +27,14 @@
"devDependencies": {
"assets-webpack-plugin": "^3.2.0",
"autoprefixer": "^6.1.2",
- "babel": "^5.8.34",
+ "babel-cli": "^6.4.5",
"babel-eslint": "^4.1.6",
- "babel-loader": "^5.4.0",
- "babel-plugin-react-transform": "^1.1.1",
+ "babel-loader": "^6.2.1",
+ "babel-plugin-react-transform": "^2.0.0",
+ "babel-plugin-transform-runtime": "^6.4.3",
+ "babel-preset-es2015": "^6.3.13",
+ "babel-preset-react": "^6.3.13",
+ "babel-preset-stage-0": "^6.3.13",
"browser-sync": "^2.10.1",
"css-loader": "^0.23.0",
"csscomb": "^3.1.8",
diff --git a/src/client.js b/src/client.js
@@ -7,7 +7,7 @@
* LICENSE.txt file in the root directory of this source tree.
*/
-import 'babel-core/polyfill';
+import 'babel-polyfill';
import ReactDOM from 'react-dom';
import FastClick from 'fastclick';
import Router from './routes';
diff --git a/src/components/ContactPage/ContactPage.js b/src/components/ContactPage/ContactPage.js
@@ -9,11 +9,10 @@
import React, { Component, PropTypes } from 'react';
import s from './ContactPage.scss';
-import withStyles from '../../decorators/withStyles';
+import withStyles from '../withStyles';
const title = 'Contact Us';
-@withStyles(s)
class ContactPage extends Component {
static contextTypes = {
@@ -37,4 +36,4 @@ class ContactPage extends Component {
}
-export default ContactPage;
+export default withStyles(ContactPage, s);
diff --git a/src/components/ContentPage/ContentPage.js b/src/components/ContentPage/ContentPage.js
@@ -9,9 +9,8 @@
import React, { Component, PropTypes } from 'react';
import s from './ContentPage.scss';
-import withStyles from '../../decorators/withStyles';
+import withStyles from '../withStyles';
-@withStyles(s)
class ContentPage extends Component {
static propTypes = {
@@ -38,4 +37,4 @@ class ContentPage extends Component {
}
-export default ContentPage;
+export default withStyles(ContentPage, s);
diff --git a/src/components/ErrorPage/ErrorPage.js b/src/components/ErrorPage/ErrorPage.js
@@ -9,11 +9,10 @@
import React, { Component, PropTypes } from 'react';
import s from './ErrorPage.scss';
-import withStyles from '../../decorators/withStyles';
+import withStyles from '../withStyles';
const title = 'Error';
-@withStyles(s)
class ErrorPage extends Component {
static contextTypes = {
@@ -36,4 +35,4 @@ class ErrorPage extends Component {
}
-export default ErrorPage;
+export default withStyles(ErrorPage, s);
diff --git a/src/components/Feedback/Feedback.js b/src/components/Feedback/Feedback.js
@@ -9,9 +9,8 @@
import React, { Component } from 'react';
import s from './Feedback.scss';
-import withStyles from '../../decorators/withStyles';
+import withStyles from '../withStyles';
-@withStyles(s)
class Feedback extends Component {
render() {
@@ -28,4 +27,4 @@ class Feedback extends Component {
}
-export default Feedback;
+export default withStyles(Feedback, s);
diff --git a/src/components/Footer/Footer.js b/src/components/Footer/Footer.js
@@ -9,10 +9,9 @@
import React, { Component } from 'react';
import s from './Footer.scss';
-import withStyles from '../../decorators/withStyles';
+import withStyles from '../withStyles';
import Link from '../Link';
-@withStyles(s)
class Footer extends Component {
render() {
@@ -33,4 +32,4 @@ class Footer extends Component {
}
-export default Footer;
+export default withStyles(Footer, s);
diff --git a/src/components/Header/Header.js b/src/components/Header/Header.js
@@ -9,11 +9,10 @@
import React, { Component } from 'react';
import s from './Header.scss';
-import withStyles from '../../decorators/withStyles';
+import withStyles from '../withStyles';
import Link from '../Link';
import Navigation from '../Navigation';
-@withStyles(s)
class Header extends Component {
render() {
@@ -36,4 +35,4 @@ class Header extends Component {
}
-export default Header;
+export default withStyles(Header, s);
diff --git a/src/components/Link/Link.js b/src/components/Link/Link.js
@@ -28,7 +28,7 @@ class Link extends Component {
onClick: PropTypes.func,
};
- static handleClick = (event) => {
+ handleClick = (event) => {
let allowTransition = true;
let clickResult;
@@ -65,7 +65,7 @@ class Link extends Component {
render() {
const { to, query, ...props } = this.props;
- return <a href={Location.createHref(to, query)} onClick={Link.handleClick.bind(this)} {...props} />;
+ return <a href={Location.createHref(to, query)} {...props} onClick={Link.handleClick} />;
}
}
diff --git a/src/components/LoginPage/LoginPage.js b/src/components/LoginPage/LoginPage.js
@@ -9,11 +9,10 @@
import React, { Component, PropTypes } from 'react';
import s from './LoginPage.scss';
-import withStyles from '../../decorators/withStyles';
+import withStyles from '../withStyles';
const title = 'Log In';
-@withStyles(s)
class LoginPage extends Component {
static contextTypes = {
@@ -37,4 +36,4 @@ class LoginPage extends Component {
}
-export default LoginPage;
+export default withStyles(LoginPage, s);
diff --git a/src/components/Navigation/Navigation.js b/src/components/Navigation/Navigation.js
@@ -10,10 +10,9 @@
import React, { Component, PropTypes } from 'react';
import cx from 'classnames';
import s from './Navigation.scss';
-import withStyles from '../../decorators/withStyles';
+import withStyles from '../withStyles';
import Link from '../Link';
-@withStyles(s)
class Navigation extends Component {
static propTypes = {
@@ -35,4 +34,4 @@ class Navigation extends Component {
}
-export default Navigation;
+export default withStyles(Navigation, s);
diff --git a/src/components/NotFoundPage/NotFoundPage.js b/src/components/NotFoundPage/NotFoundPage.js
@@ -9,11 +9,10 @@
import React, { Component, PropTypes } from 'react';
import s from './NotFoundPage.scss';
-import withStyles from '../../decorators/withStyles';
+import withStyles from '../withStyles';
const title = 'Page Not Found';
-@withStyles(s)
class NotFoundPage extends Component {
static contextTypes = {
@@ -37,4 +36,4 @@ class NotFoundPage extends Component {
}
-export default NotFoundPage;
+export default withStyles(NotFoundPage, s);
diff --git a/src/components/RegisterPage/RegisterPage.js b/src/components/RegisterPage/RegisterPage.js
@@ -9,11 +9,10 @@
import React, { Component, PropTypes } from 'react';
import s from './RegisterPage.scss';
-import withStyles from '../../decorators/withStyles';
+import withStyles from '../withStyles';
const title = 'New User Registration';
-@withStyles(s)
class RegisterPage extends Component {
static contextTypes = {
@@ -37,4 +36,4 @@ class RegisterPage extends Component {
}
-export default RegisterPage;
+export default withStyles(RegisterPage, s);
diff --git a/src/components/withStyles.js b/src/components/withStyles.js
@@ -0,0 +1,32 @@
+/**
+ * React Starter Kit (https://www.reactstarterkit.com/)
+ *
+ * Copyright © 2014-2016 Kriasoft, LLC. All rights reserved.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE.txt file in the root directory of this source tree.
+ */
+
+import React, { Component, PropTypes } from 'react';
+
+function withStyles(BaseComponent, ...styles) {
+ return class StyledComponent extends Component {
+ static contextTypes = {
+ insertCss: PropTypes.func.isRequired,
+ };
+
+ componentWillMount() {
+ this.removeCss = this.context.insertCss.apply(undefined, styles);
+ }
+
+ componentWillUnmount() {
+ setTimeout(this.removeCss, 0);
+ }
+
+ render() {
+ return <BaseComponent {...this.props} />;
+ }
+ };
+}
+
+export default withStyles;
diff --git a/src/decorators/withViewport.js b/src/components/withViewport.js
diff --git a/src/decorators/withStyles.js b/src/decorators/withStyles.js
@@ -1,32 +0,0 @@
-/**
- * React Starter Kit (https://www.reactstarterkit.com/)
- *
- * Copyright © 2014-2016 Kriasoft, LLC. All rights reserved.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE.txt file in the root directory of this source tree.
- */
-
-import React, { Component, PropTypes } from 'react';
-
-function withStyles(...styles) {
- return (BaseComponent) => class StyledComponent extends Component {
- static contextTypes = {
- insertCss: PropTypes.func.isRequired,
- };
-
- componentWillMount() {
- this.removeCss = this.context.insertCss.apply(undefined, styles);
- }
-
- componentWillUnmount() {
- this.removeCss();
- }
-
- render() {
- return <BaseComponent {...this.props} />;
- }
- };
-}
-
-export default withStyles;
diff --git a/src/server.js b/src/server.js
@@ -7,7 +7,7 @@
* LICENSE.txt file in the root directory of this source tree.
*/
-import 'babel-core/polyfill';
+import 'babel-polyfill';
import path from 'path';
import express from 'express';
import React from 'react';
@@ -27,7 +27,7 @@ server.use(express.static(path.join(__dirname, 'public')));
//
// Register API middleware
// -----------------------------------------------------------------------------
-server.use('/api/content', require('./api/content'));
+server.use('/api/content', require('./api/content').default);
//
// Register server-side rendering middleware
diff --git a/tools/run.js b/tools/run.js
@@ -11,19 +11,21 @@ function format(time) {
return time.toTimeString().replace(/.*(\d{2}:\d{2}:\d{2}).*/, '$1');
}
-async function run(fn, options) {
+function run(fn, options) {
+ const task = typeof fn.default === 'undefined' ? fn : fn.default;
const start = new Date();
- console.log(`[${format(start)}] Starting '${fn.name}'...`);
- await fn(options);
- const end = new Date();
- const time = end.getTime() - start.getTime();
- console.log(`[${format(end)}] Finished '${fn.name}' after ${time} ms`);
+ console.log(`[${format(start)}] Starting '${task.name}'...`);
+ return task(options).then(() => {
+ const end = new Date();
+ const time = end.getTime() - start.getTime();
+ console.log(`[${format(end)}] Finished '${task.name}' after ${time} ms`);
+ });
}
if (process.mainModule.children.length === 0 && process.argv.length > 2) {
delete require.cache[__filename];
- const module = process.argv[2];
- run(require('./' + module + '.js')).catch(err => console.error(err.stack));
+ const module = require('./' + process.argv[2] + '.js').default;
+ run(module).catch(err => console.error(err.stack));
}
export default run;
diff --git a/tools/start.js b/tools/start.js
@@ -41,9 +41,8 @@ async function start() {
.forEach(x => x.query = {
// Wraps all React components into arbitrary transforms
// https://github.com/gaearon/babel-plugin-react-transform
- plugins: ['react-transform'],
- extra: {
- 'react-transform': {
+ plugins: [
+ ['react-transform', {
transforms: [
{
transform: 'react-transform-hmr',
@@ -54,8 +53,8 @@ async function start() {
imports: ['react', 'redbox-react'],
},
],
- },
- },
+ }],
+ ],
});
});
