nickmessing / babel-plugin-jsx-v-model

JSX Syntactic Sugar Plugin for v-model
MIT License
155 stars 12 forks source link

Broken with Babel 7 #11

Open chrisvfritz opened 6 years ago

chrisvfritz commented 6 years ago

I'm not sure if the bug is here or in babel-plugin-transform-vue-jsx, but trying to use v-model in Babel 7 results in this error:

This API has been removed. If you're looking for this functionality in Babel 7, you should import the '@babel/helper-module-imports' module and use the functions exposed  from that module, such as 'addNamed' or 'addDefault'.

  at File.addImport (node_modules/@babel/core/lib/transformation/file/file.js:112:11)
  at PluginPass.addImport (node_modules/@babel/core/lib/transformation/plugin-pass.js:30:22)
  at buildOpeningElementAttributes (node_modules/babel-plugin-transform-vue-jsx/index.js:182:25)
  at buildElementCall (node_modules/babel-plugin-transform-vue-jsx/index.js:116:17)
  at PluginPass.exit (node_modules/babel-plugin-transform-vue-jsx/index.js:20:26)
  at newFn (node_modules/@babel/traverse/lib/visitors.js:223:21)
  at NodePath._call (node_modules/@babel/traverse/lib/path/context.js:64:19)
  at NodePath.call (node_modules/@babel/traverse/lib/path/context.js:38:17)
  at NodePath.visit (node_modules/@babel/traverse/lib/path/context.js:108:8)
  at TraversalContext.visitQueue (node_modules/@babel/traverse/lib/context.js:135:18)

Possibly related to https://github.com/vuejs/babel-plugin-transform-vue-jsx/issues/112.

LinusBorg commented 6 years ago

It seems that's fixable. someone already posted a fixed fork for babel-plugin-transform-vue-jsx in the issue you linked to, and it looks pretty simple:

https://github.com/wietseva/babel-plugin-transform-vue-jsx/commit/1b9ebada45d7a365e7ba3803cdd22dce460bee6c

nickmessing commented 6 years ago

Yep, sorry guys, I'll try to get https://github.com/vuejs/jsx done by the end of the week, will completely redo v-model and event modifiers and make that all a part of that monorepo.

chrisvfritz commented 6 years ago

Woohoo! Thanks @nickmessing. 😄

sant123 commented 6 years ago

Any advance on this? For now this is my approach:

<div>
    <input type="text" onInput={e => this.firstName = e.target.value} value={this.firstName} />
    <Home firstName={this.firstName} />
</div>
dmrickey commented 5 years ago

It seems to me that this is still broken..

edit: Never mind, it looks like all is well if you follow @nickmessing 's link and also install https://github.com/vuejs/jsx