wonderful-panda/vue-tsx-support

Jest and TSX are not working

Maxim-Mazurok opened this issue · 5 comments

Maxim-Mazurok commented

Please, see vuejs/vue-cli#6389 for details.
Related to #77 and 175cdf9

In summary, we need CommonJS version.
Workaround: add transformIgnorePatterns: [] to babel config

A proper fix is to change the vue-tsx-support package to provide both CommonJS and ES module entries, following the guide from the Node.js documentation: https://nodejs.org/api/packages.html#packages_conditional_exports

(c) @sodatea

Maxim-Mazurok commented

@wonderful-panda any update on this one, please?

wonderful-panda commented

Sorry for the late response.

vue-tsx-support can't provide multiple modules for now, because this exposes not only "vue-tsx-support" but also "vue-tsx-support/lib/{vca, modifiers}".

I'm planning to separate them into other packages, maybe within a month.

  • 👍1
toomuchdesign commented

Hey @wonderful-panda, I've just come this library and it feels like a wave of fresh air in the so self-constraint world of Vue.js. 🙌

I'm sure I'm missing context here, wouldn't be enough exposing both a lib and a es folder containing respectively the CommonJS and ES module build of this library?

Happy to support if it made any sense.
Cheers!

wonderful-panda commented

I just didn't know multiple entry points can be exposed with both esmodule and commonjs.

Please confirm 3.2.0-beta.1 solves problem.

  • ❤️1
Maxim-Mazurok commented

I think that it's fixed now.
With 3.1.0 and transformIgnorePatterns: ["vue-tsx-support/*"] it fails:

SyntaxError: Unexpected token 'export'

    > 1 | import * as tsx from "vue-tsx-support";
        | ^
      2 | import { VNode } from "vue";
      3 | import {
      4 |   VBtn,

With 3.2.0-beta.1 and transformIgnorePatterns: ["vue-tsx-support/*"] it works as expected.

I still can't remove transformIgnorePatterns completely, because if I remove it, it fails for vuetify now:

SyntaxError: Unexpected token 'export'

      1 | import * as tsx from "vue-tsx-support";
      2 | import { VNode } from "vue";
    > 3 | import { VTabs, VTabsItems } from "vuetify/lib";
        | ^

So I'll raise this issue for vuetify repo. Thank you!

It also works now when I use this pattern:
transformIgnorePatterns: ["node_modules/(?!(vuetify)/)"], (inspired by)