Babel 6
aruberto opened this issue · comments
Babel 6 was just released and has a new plugin API. Assuming this plugin will need to be updated to support it (otherwise can just close this issue).
👍 want this
👍
+1
Please, don't +1 the issue, it doesn't help at all.
I'm aware Babel 6 is out and I'll support it in the next release.
If you feel like making a PR or temporarily maintaining a Babel 6-compatible fork, please do.
I will get back to this (and React 0.14 full support) in a week or two, in the meantime please be patient.
I'm trying to make a PR, but can't for the life of me figure out where babel-plugin has gone.
It's used by the build npm script, but is no longer part of babel. It doesn't seem to be part of babel-core, babel-cli, or even babel-runtime, and there's no package called just babel-plugin. Am I missing something obvious?
As you can probably tell, this is my first attempt at babel plugins, so I'm not familiar with the ecosystem...
It's not really important, from what I remember. I just copied it because that's what other plugins were using, but I think it can be replaced by simple babel CLI call. You can take inspiration from any Babel plugin here: https://github.com/babel/babel/tree/development/packages.
Thanks, will look into it and report back if/when I have something.
I've made some progress on this
branch: https://github.com/chicoxyzzy/babel-plugin-react-transform/tree/babel-6
commit: 292e5ad
If you npm link my babel-6 branch you can see that visitor's exit method still returns result of t.program. I can't find any docs on how to fix this method to work proper. I think the rest should work fine.
Also tests are still on Babel 5 so they won't work either.
@theneva do you have any progress on this?
options should be passed like so
presets: ['es2015', 'react'],
plugins: [
['transform-object-rest-spread'],
['transform-class-properties'],
['react-transform', {
transforms: [
{
transform: 'react-transform-hmr',
imports: ['react'],
locals: ['module'],
}, {
transform: 'react-transform-catch-errors',
imports: ['react', 'redbox-react'],
},
],
}],
],@chicoxyzzy thanks , I didn't know how to add extra before
Nice, @chicoxyzzy. I haven't been able to get very far, no – and I unfortunately can't get around to look any more into it before tomorrow. Please keep up your good work 😃 :
We should make a Babel 6 preset for HMR + error catching.
Just threw it together and haven't tested yet but: https://github.com/danmartinez101/babel-preset-react-hmre
Is this on the right track, @gaearon ?
Yep @danmartinez101 it looks ok.
But first of all we need to:
- migrate build step to Babel 6
- update tests
- fix
Program.exit
I'll try my best to fix it but I'll be very busy next two weeks. Anyway feel free to ping me if you think I can help.
I've created a pull request on chicoxyzzy#1 which updates the tests to use babel 6. All but the Vanilla test on that branch now throw an error
Unexpected return value from visitor method function (path) {
return fn.call(state, path, state);
}
@buildmaster I just checked your PR. If you will rm -rf node_modules and then npm install you'll see error
> babel-plugin build
sh: babel-plugin: command not found
that's because there is no babel-plugin in node_modules/.bin directory anymore. So we should fix build script in package.json somehow
ok I've copied the command from the old babel-plugin bin, but means a dev requirement on babel-cli as well.
ok made a couple of updates, but I think I'm at the limit of my knowledge, so might have to wait for someone who knows how the plugin actually works to pick up the fix
@buildmaster @chicoxyzzy I think this is the easiest way to do it, yeah – that's how I did it in my (still unpushed) branch too. Not sure you need the --copy-files option, though?
At any rate, this will be quite a bit bigger than simply changing the plugin export… especially due to fixing the tests, which I don't have any experience with.
Is anyone close to having a complete PR on this?
Hi I updated some files based on @chicoxyzzy 's and @buildmaster 's work. PR is at chicoxyzzy#2 .
since the generated sources changed, need experts to review.
three of four test cases look fine, but test/fixtures/modern is still failed. If enabling decorator in babel, the error message is same as babel/babel#2645 and babel/babel#2801 .
Good work @TaopaiC and @buildmaster! I've merged your commits! Now we should fix Program.exit and failing test for modern classes
@gaearon should I create WIP PR so everyone will be able to help and track progress more comfortably?
is any news in here?
Please feel free to create a PR.
I will be able to review in a couple of weeks and no sooner due to my current workload.
Please feel free to create a PR.
here it is #48
I have no idea how babel or this plugin work so I'm going to start hacking away in a different fork for now.
You can find it here: https://github.com/danmartinez101/babel-plugin-react-transform/tree/unit-tests
This is the approach I'm planning on taking:
- Write granular unit tests for the existing plugin (with Babel 5)
- Upgrade to Babel 6
- Fix the granular unit tests
- Update the fixtures
- Hope that the fixture-based tests pass because the unit tests covered all the logic (but probably will need to tweak them due to Babel potentially outputting things differently)
Once I get through all or most of this, I can either apply what I've learned to the branch created above, or we can just go with this one ( assuming that it actually works, of course... and that is a big assumption :P )
Edit: I'm also using jasmine so I can focus on writing tests instead of figuring out how to configure mocha but these can be converted to mocha easily later
Just throwing in this amazing new reference: https://github.com/thejameskyle/babel-plugin-handbook
We did some things in a wrong way because I didn't know any better.
While we're at it, we can learn to use scope correctly, etc.
I started reading that last night; it has helped a lot already :D :D I was planning on seeing if parts of the plugin could be improved, but want to get through tests and upgrade first to make sure I really understand it. I'm hoping to get it wrapped up tonight.
I'm also thinking that https://github.com/babel/babel/tree/master/packages/babel-template is going to be useful here.
@danmartinez101 for sure—babel-template is being used to create the core HOCs (as a workaround for decorators) in #48 and there are definitely some other areas i think templating could simplify things
@gaearon what do you think is incorrect with respect to scope?
how's it going?
any luck with this?