Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Remove @babel/preset-typescript #103

Merged
merged 1 commit into from
Jan 23, 2024
Merged

Conversation

lxsmnsyc
Copy link
Member

@lxsmnsyc lxsmnsyc commented Jul 7, 2023

As proposed at #95

Some users had also claimed that the code has been transformed before they can touch the TS code which breaks some intended code or conflicts with other plugins.

So in this PR, we make sure that Babel transform step will only understand TypeScript code but not letting it do the compilation. TS compilation is delegated to esbuild.

| TransformOptions
| ((source: string, id: string, ssr: boolean) => TransformOptions)
| ((source: string, id: string, ssr: boolean) => Promise<TransformOptions>);
typescript: {
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Since the preset no longer exists, this is no longer needed.

@@ -335,7 +215,7 @@ export default function solidPlugin(options: Partial<Options> = {}): Plugin {
* We only need esbuild on .ts or .js files.
* .tsx & .jsx files are handled by us
*/
esbuild: { include: /\.ts$/ },
// esbuild: { include: /\.ts$/ },
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We need to pass the transformation step to esbuild.

@@ -370,13 +250,13 @@ export default function solidPlugin(options: Partial<Options> = {}): Plugin {
const isSsr = transformOptions && transformOptions.ssr;
const currentFileExtension = getExtension(id);

const extensionsToWatch = [...(options.extensions || []), '.tsx', '.jsx'];
const extensionsToWatch = options.extensions || [];
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I separated this for the next RegExp filters I implemented

const allExtensions = extensionsToWatch.map((extension) =>
// An extension can be a string or a tuple [extension, options]
typeof extension === 'string' ? extension : extension[0],
);

if (!filter(id) || !allExtensions.includes(currentFileExtension)) {
if (!filter(id) || !(/\.[mc]?[tj]sx$/i.test(id) || allExtensions.includes(currentFileExtension))) {
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just a trick

sourceMaps: true,
configFile: false,
babelrc: false,
parserOpts: {
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Since Babel doesn't actually extend the language, TS is already built into its core. Babel can process TypeScript files by enabling it through the parser options.

@MrFoxPro
Copy link

Vite supports TS out of box, so this sounds very reasonable.

@jpdutoit
Copy link

Could we add @babel/plugin-syntax-decorators, since some valid Typescript fails without this

@lxsmnsyc
Copy link
Member Author

@jpdutoit doesn't esbuild support decorators?

@jpdutoit
Copy link

It does, but this plugin runs before esbuild, and babel requires @babel/plugin-syntax-decorators to parse decorators and emit them unchanged. Without using this plugin, it fails with an error.

(The alternative plugin that transforms decorators is @babel/plugin-proposal-decorators.)

@MrFoxPro
Copy link

I guess its possible to call transformWithEsbuild and preserve JSX

@lxsmnsyc
Copy link
Member Author

lxsmnsyc commented Sep 14, 2023

@jpdutoit actually we don't need the plugin. All syntax plugins are already built into Babel, so I just need to set the flag in the parser options (the same way I enabled jsx and typescript)

@ryansolid
Copy link
Member

For whatever reason changing this in SolidStart gets me the classic can't find React .. Not sure why but seems to be delegating the TSX transform to React. I won't merge at the moment and leave this to another release.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants