plugin-vue-jsx: Allow esbuild to perform typescript transformation #556
Description
Related plugins
Description
In the current implementation of plugin-vue-jsx typescript transformation for ".tsx" files is done by the babel plugin instead of esbuild.
The main problem with such approach is that the same non-jsx code in "ts" and "tsx" may behave differently since transformation by '@babel/plugin-transform-typescript' does not take into account tsconfig options like esbuild does.
Moreover the transformation may require additional babelPlugins like babel-plugin-proposal-decorators or babel-plugin-transform-class-properties and they are not fully equivalent to what is expected in typescript (example).
As I see it, the proper behaviour is that plugin-vue-jsx transforms only the jsx syntax and all other typescript syntax is handled by esbuild.
Suggested solution
Proposed solution:
- The changes are enabled by a new
tsTransform: 'esbuild' | 'babel'option with value 'esbuild'. By default 'babel' is used to prevent breakage. - '@babel/plugin-syntax-typescript' should be used instead of '@babel/plugin-transform-typescript' - it does not perform any transformations.
esbuild.includeshould not be overriden in the "config" hook- "transform" hook should have an
order: 'pre'to run before esbuild transformation - If plugin-vue-jsx consumers would like to enable support for decorators or other opt-in syntax, they should pass corresponding "syntax" (that affect parser only) plugins to babelPlugins
If the concept of solution is OK, I can try to implement it (if you are OK with it).
Alternative
No response
Additional context
No response
Validations
- Follow our Code of Conduct
- Read the Contributing Guidelines.
- Read the docs.
- Check that there isn't already an issue that request the same feature to avoid creating a duplicate.