AMorgaut / babel-plugin-transform-class

A minimalist ES6 class babel transformer
MIT License
5 stars 1 forks source link

export default class ... breaks transpiler #24

Open espretto opened 6 years ago

espretto commented 6 years ago

Hello,

thank you for making this great alternative for babel's class-transform. the spec-compliant version seems rather heavy, especially after d. walsh on prototypes (link in the readme?).

When I try to export and declare a class on the same line, I get the following error:

Error transforming <path>/src/dom/treewalker.js with 'babel' plugin: <path>/src/dom/treewalker.js: We don't know what to do with this node type. We were previously a Statement but we can't fit in here?
Error: <path>/src/dom/treewalker.js: We don't know what to do with this node type. We were previously a Statement but we can't fit in here?
    at NodePath.insertAfter (<path>/node_modules/babel-traverse/lib/path/modification.js:175:13)
    at NodePath.replaceWithMultiple (<path>/node_modules/babel-traverse/lib/path/replacement.js:82:8)
    at PluginPass.exit (<path>/node_modules/babel-plugin-transform-class/lib/index.js:20:14)
    at newFn (<path>/node_modules/babel-traverse/lib/visitors.js:276:21)
    at NodePath._call (<path>/node_modules/babel-traverse/lib/path/context.js:76:18)
    at NodePath.call (<path>/node_modules/babel-traverse/lib/path/context.js:48:17)
    at NodePath.visit (<path>/node_modules/babel-traverse/lib/path/context.js:117:8)
    at TraversalContext.visitQueue (<path>/node_modules/babel-traverse/lib/context.js:150:16)
    at TraversalContext.visitSingle (<path>/node_modules/babel-traverse/lib/context.js:108:19)
    at TraversalContext.visit (<path>/node_modules/babel-traverse/lib/context.js:192:19)

Here goes /src/dom/treewalker.js

export default class TreeWalker {
  // empty test
}

My solution for now is to put the export on a seperate line.

AMorgaut commented 6 years ago

Thank you for your feedback

I usually use dedicated lines for exports

But yes this should be supported, I'll look into it

AMorgaut commented 5 years ago

Did some try @espretto Which transform plugin did you use for the es6 module support?

espretto commented 5 years ago

I'm using a subset of the @babel/preset-env, here goes my .babelrc:

{
  "plugins": [
    "@babel/plugin-transform-flow-strip-types",

    "transform-class",

    "@babel/plugin-transform-arrow-functions",
    "@babel/plugin-transform-block-scoped-functions",
    "@babel/plugin-transform-block-scoping",
    ["@babel/plugin-transform-computed-properties", { "loose": false }],
    "@babel/plugin-transform-destructuring",
    "@babel/plugin-transform-duplicate-keys",
    "@babel/plugin-transform-literals",
    "@babel/plugin-transform-parameters",
    "@babel/plugin-transform-shorthand-properties",
    "@babel/plugin-transform-spread",
    "@babel/plugin-transform-template-literals"
  ],
  "parserOpts": {
    "plugins": ["flow"]
  }
}

I can't find the module support though. it just seems to work with both webpack's babel-loader and rollup-babel-plugin.

AMorgaut commented 5 years ago

Thanks I think I found the solution If you are ok, I'll publish it in a feature branch so you can confirm it is working for you, and add you as a reviewer of the Pull Request

AMorgaut commented 5 years ago

So current state is working, but will still try to make it better

Instead of failing it now transforms

export default class TreeWalker {
  // empty test
}

Into

function TreeWalker() {
  // empty test
}
export default TreeWalker

and

export class TreeWalker {
  // empty test
}

Into

function TreeWalker() {
  // empty test
}
export { TreeWalker }

Note that I realize it is kind of a workaround. I'm a bit concerned because my transform plugin is meant to work "as-is" and provide

export default function TreeWalker() {
  // empty test
}

and

export function TreeWalker() {
  // empty test
}

I'll spend a little more time to get what's going wrong