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

Setup babel for ES6 and JSX transformation. #1060

Merged
merged 4 commits into from Jun 9, 2016

Conversation

Projects
None yet
2 participants
@wolfd
Contributor

wolfd commented Jun 2, 2016

The eventual goal is to have SingularityUI to be entirely a React/Babel ES6 project.

Steps taken:

  • Convert GlobalSearch to JSX/ES6

Notes on how to do coffeescript -> es6 transformation:

  • the decaffeinate npm module does a lot of the heavy lifting, but do it one file at a time
  • comment out all of the CJSX parts of the file, convert those manually
  • rewrite parts that use coffeescript specific functionality (such as the in keyword)
  • because of the differences in ES6 imports versus CommonJS, you have to add .default to the ES6 imports
Show outdated Hide outdated SingularityUI/app/components/globalSearch/GlobalSearch.jsx
render() {
let options = _.pluck(this.props.requests.toJSON(), 'id');
globalSearchClasses = classNames({

This comment has been minimized.

@tpetr

tpetr Jun 2, 2016

Member

add const globalSearchClasses here instead of the let at the top of the file

@tpetr

tpetr Jun 2, 2016

Member

add const globalSearchClasses here instead of the let at the top of the file

Show outdated Hide outdated SingularityUI/webpack.config.js
@@ -68,7 +70,7 @@ module.exports = {
}
}),
new webpack.DefinePlugin({
'process.env.NODE_ENV': '"production"'
'process.env.NODE_ENV': JSON.stringify('development')

This comment has been minimized.

@tpetr

tpetr Jun 2, 2016

Member

curious, why the change here?

@tpetr

tpetr Jun 2, 2016

Member

curious, why the change here?

This comment has been minimized.

@wolfd

wolfd Jun 2, 2016

Contributor

Oh, right. I forgot that I put this in there.

We should figure out if there's a way to override the default behavior and not do this.

Minified react (which is used when you use production) doesn't have good error messages. I wanted to see what the issue was with something, and they were being suppressed. By the time this patch gets merged I'd like to see this behavior default to production but use development if specified on the command line.

@wolfd

wolfd Jun 2, 2016

Contributor

Oh, right. I forgot that I put this in there.

We should figure out if there's a way to override the default behavior and not do this.

Minified react (which is used when you use production) doesn't have good error messages. I wanted to see what the issue was with something, and they were being suppressed. By the time this patch gets merged I'd like to see this behavior default to production but use development if specified on the command line.

@tpetr tpetr added this to the 0.8.0 milestone Jun 7, 2016

@tpetr tpetr merged commit e060efe into master Jun 9, 2016

2 checks passed

continuous-integration/travis-ci/pr The Travis CI build passed
Details
continuous-integration/travis-ci/push The Travis CI build passed
Details

@ssalinas ssalinas deleted the babel branch Sep 12, 2016

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment