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.

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

Update to Babel 6 #778

Closed
wants to merge 3 commits into from
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
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
31 changes: 15 additions & 16 deletions .babelrc
Original file line number Diff line number Diff line change
@@ -1,26 +1,25 @@
{
"stage": 0,
"optional": "runtime",
"loose": "all",
"presets": ["react", "es2015", "stage-0"],

"plugins": [
"typecheck"
"transform-runtime",
"add-module-exports",
"transform-decorators-legacy",
"transform-react-display-name"
],

"env": {
"development": {
"plugins": [
"react-transform"
],
"extra": {
"react-transform": {
"transforms": [{
"transform": "react-transform-catch-errors",
"imports": [
"react",
"redbox-react"
"typecheck",
["react-transform", {
"transforms": [{
"transform": "react-transform-catch-errors",
"imports": ["react", "redbox-react"]
}
]
}]
}
}
}]
]
}
}
}
42 changes: 28 additions & 14 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -27,8 +27,8 @@
"start": "concurrent --kill-others \"npm run start-prod\" \"npm run start-prod-api\"",
"start-prod": "better-npm-run start-prod",
"start-prod-api": "better-npm-run start-prod-api",
"build": "webpack --verbose --colors --display-error-details --config webpack/prod.config.js",
"postinstall": "webpack --display-error-details --config webpack/prod.config.js",
"build": "better-npm-run build",
"postinstall": "npm run build",
"lint": "eslint -c .eslintrc src api",
"start-dev": "better-npm-run start-dev",
"start-dev-api": "better-npm-run start-dev-api",
Expand Down Expand Up @@ -79,17 +79,33 @@
"UV_THREADPOOL_SIZE": 100,
"NODE_PATH": "./src"
}
},
"build": {
"command": "webpack --verbose --colors --display-error-details --config webpack/prod.config.js",
"env": {
"NODE_ENV": "production"
}
}
},
"dependencies": {
"babel": "~5.8.29",
"babel-plugin-typecheck": "^2.0.0",
"babel-core": "^6.3.26",
"babel-loader": "^6.2.1",
"babel-plugin-add-module-exports": "^0.1.2",
"babel-plugin-transform-decorators-legacy": "^1.3.4",
"babel-plugin-transform-react-display-name": "^6.3.13",
"babel-plugin-transform-runtime": "^6.3.13",
"babel-polyfill": "^6.3.14",
"babel-preset-es2015": "^6.3.13",
"babel-preset-react": "^6.3.13",
"babel-preset-stage-0": "^6.3.13",
"babel-register": "^6.3.13",
"babel-runtime": "^6.3.19",
"body-parser": "^1.14.1",
"compression": "^1.6.0",
"express": "^4.13.3",
"express-session": "^1.12.1",
"history": "1.17.0",
"file-loader": "^0.8.5",
"history": "1.17.0",
"hoist-non-react-statics": "^1.0.3",
"http-proxy": "^1.12.0",
"invariant": "^2.2.0",
Expand Down Expand Up @@ -124,37 +140,35 @@
},
"devDependencies": {
"autoprefixer-loader": "^3.1.0",
"babel-core": "~5.8.33",
"babel-eslint": "^4.1.3",
"babel-loader": "~5.3.3",
"babel-plugin-react-transform": "~1.1.1",
"babel-runtime": "~5.8.29",
"babel-eslint": "^5.0.0-beta6",
"babel-plugin-react-transform": "^2.0.0",
"babel-plugin-typecheck": "^3.6.0",
"better-npm-run": "^0.0.4",
"bootstrap-sass": "^3.3.5",
"bootstrap-sass-loader": "^1.0.9",
"chai": "^3.3.0",
"clean-webpack-plugin": "^0.1.4",
"concurrently": "^0.1.1",
"css-loader": "^0.23.1",
"eslint": "1.10.3",
"eslint-config-airbnb": "0.1.0",
"eslint-loader": "^1.0.0",
"eslint-plugin-import": "^0.8.0",
"eslint-plugin-react": "^3.5.0",
"clean-webpack-plugin": "^0.1.4",
"css-loader": "^0.23.1",
"extract-text-webpack-plugin": "^0.9.1",
"font-awesome": "^4.4.0",
"font-awesome-webpack": "0.0.4",
"karma": "^0.13.10",
"json-loader": "^0.5.4",
"karma": "^0.13.10",
"karma-cli": "^0.1.1",
"karma-mocha": "^0.2.0",
"karma-mocha-reporter": "^1.1.1",
"karma-phantomjs-launcher": "^0.2.1",
"karma-sourcemap-loader": "^0.3.5",
"karma-webpack": "^1.7.0",
"mocha": "^2.3.3",
"phantomjs": "^1.9.18",
"node-sass": "^3.4.2",
"phantomjs": "^1.9.18",
"phantomjs-polyfill": "0.0.1",
"react-a11y": "^0.2.6",
"react-addons-test-utils": "^0.14.0",
Expand Down
2 changes: 1 addition & 1 deletion server.babel.js
Original file line number Diff line number Diff line change
Expand Up @@ -12,4 +12,4 @@ try {
console.error(err);
}

require('babel-core/register')(config);
require('babel-register')(config);
2 changes: 1 addition & 1 deletion src/client.js
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
/**
* THIS IS THE ENTRY POINT FOR THE CLIENT, JUST LIKE server.js IS THE ENTRY POINT FOR THE SERVER.
*/
import 'babel/polyfill';
import 'babel-polyfill';
import React from 'react';
import ReactDOM from 'react-dom';
import createHistory from 'history/lib/createBrowserHistory';
Expand Down
2 changes: 1 addition & 1 deletion src/config.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
require('babel/polyfill');
require('babel-polyfill');

const environment = {
development: {
Expand Down
38 changes: 27 additions & 11 deletions webpack/dev.config.js
Original file line number Diff line number Diff line change
@@ -1,10 +1,9 @@
require('babel/polyfill');
require('babel-polyfill');

// Webpack config for development
var fs = require('fs');
var path = require('path');
var webpack = require('webpack');
var WebpackIsomorphicTools = require('webpack-isomorphic-tools');
var assetsPath = path.resolve(__dirname, '../static/dist');

Choose a reason for hiding this comment

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

hmm why was this removed? Not needed anymore?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Well, to my understanding the non-plugin version of webpack-isomorphic-tools is only required for server-side patching of the require function, which should be covered here.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

But as it is not really related, I can squash and move this change as well as the (alphabetical) reordering of npm packages into a separate cleanup commit, should this be approved.

var host = (process.env.HOST || 'localhost');
var port = parseInt(process.env.PORT) + 1 || 3001;
Expand All @@ -23,23 +22,40 @@ try {
console.error(err);
}


var babelrcObjectDevelopment = babelrcObject.env && babelrcObject.env.development || {};
var babelLoaderQuery = Object.assign({}, babelrcObject, babelrcObjectDevelopment);

// merge global and dev-only plugins
var combinedPlugins = babelrcObject.plugins || [];
combinedPlugins = combinedPlugins.concat(babelrcObjectDevelopment.plugins);

var babelLoaderQuery = Object.assign({}, babelrcObjectDevelopment, babelrcObject, {plugins: combinedPlugins});
delete babelLoaderQuery.env;

// Since we use .babelrc for client and server, and we don't want HMR enabled on the server, we have to add
// the babel plugin react-transform-hmr manually here.

// make sure react-transform is enabled
babelLoaderQuery.plugins = babelLoaderQuery.plugins || [];
if (babelLoaderQuery.plugins.indexOf('react-transform') < 0) {
babelLoaderQuery.plugins.push('react-transform');
var reactTransform = null;
for (var i = 0; i < babelLoaderQuery.plugins.length; ++i) {
var plugin = babelLoaderQuery.plugins[i];
if (Array.isArray(plugin) && plugin[0] === 'react-transform') {
reactTransform = plugin;
}
}

babelLoaderQuery.extra = babelLoaderQuery.extra || {};
if (!babelLoaderQuery.extra['react-transform']) {
babelLoaderQuery.extra['react-transform'] = {};
if (!reactTransform) {
reactTransform = ['react-transform', {transforms: []}];
babelLoaderQuery.plugins.push(reactTransform);
}
if (!babelLoaderQuery.extra['react-transform'].transforms) {
babelLoaderQuery.extra['react-transform'].transforms = [];

if (!reactTransform[1] || !reactTransform[1].transforms) {
reactTransform[1] = Object.assign({}, reactTransform[1], {transforms: []});
}
babelLoaderQuery.extra['react-transform'].transforms.push({

// make sure react-transform-hmr is enabled
reactTransform[1].transforms.push({
transform: 'react-transform-hmr',
imports: ['react'],
locals: ['module']
Expand Down
14 changes: 5 additions & 9 deletions webpack/prod.config.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
require('babel/polyfill');
require('babel-polyfill');

// Webpack config for creating the production bundle.
var path = require('path');
Expand Down Expand Up @@ -58,6 +58,10 @@ module.exports = {
// css files from the extract-text-plugin loader
new ExtractTextPlugin('[name]-[chunkhash].css', {allChunks: true}),
new webpack.DefinePlugin({
'process.env': {
NODE_ENV: '"production"'
},

__CLIENT__: true,
__SERVER__: false,
__DEVELOPMENT__: false,
Expand All @@ -67,14 +71,6 @@ module.exports = {
// ignore dev config
new webpack.IgnorePlugin(/\.\/dev/, /\/config$/),

// set global vars
new webpack.DefinePlugin({
'process.env': {
// Useful to reduce the size of client-side libraries, e.g. react
NODE_ENV: JSON.stringify('production')
}
}),

// optimizations
new webpack.optimize.DedupePlugin(),
new webpack.optimize.OccurenceOrderPlugin(),
Expand Down