Add babel-plugin-syntax-typescript, babel-plugin-transform-typescript, and babel-preset-typescript #5899

ghost · 2017-06-28T21:28:28Z

Q	A
Patch: Bug Fix?	no
Major: Breaking Change?	no
Minor: New Feature?	yes
Deprecations?	no
Spec Compliancy?	no
Tests Added/Pass?	tests added and pass
Fixed Tickets
License	MIT
Doc PR
Dependency Changes	no

Adds babel-plugin-syntax-typescript, which just enables the "typescript" babylon plugin.
Adds babe-plugin-transform-typescript, which transforms TypeScript-specific features to ES.Next.
Note: This contains a TODO to be removed once #5856 is in.
This does not include the full test suite, which will require this, #5856, and #5896 to all come together.

mention-bot · 2017-06-28T21:28:29Z

@andy-ms, thanks for your PR! By analyzing the history of the files in this pull request, we identified @hzoo, @existentialism and @loganfsmyth to be potential reviewers.

hzoo · 2017-06-28T21:30:25Z

We can do babel-preset-typescript here too although it would just be the plugin

hzoo · 2017-06-30T21:41:28Z

packages/babel-plugin-transform-typescript/src/enum.js

+}
+
+// Based on the TypeScript repository's `evalConstant` in `checker.ts`.
+function evaluate(expr, seen: PreviousEnumMembers) {


cool, you probably want to just use the same logic but just FYI if you didn't know we have a path.evaluate as well

Also, we need to be able to evaluate previously-seen enum values, so any function on just the path wouldn't be enough:

enum E { A = 1, B = A * 2, C, // inferred as 3 }

jridgewell

I'll review the enum stuff later.

jridgewell · 2017-06-30T21:53:34Z

packages/babel-plugin-transform-typescript/src/index.js

+      Program(path, state: State) {
+        state.sourceFileHasJsx = false;
+        path.traverse({
+          JSXOpeningElement() {


This shouldn't be necessary.

jridgewell · 2017-06-30T22:01:19Z

packages/babel-plugin-transform-typescript/src/index.js

+
+      Program(path, state: State) {
+        state.sourceFileHasJsx = false;
+        path.traverse({


We can avoid a full file traversal if we only do this when we encounter a import React.

jridgewell · 2017-06-30T22:02:20Z

packages/babel-plugin-transform-typescript/src/index.js

+
+        const assigns = parameterProperties.map(p => {
+          let name;
+          if (p.type === "Identifier") {


t.isIdentifier(p). Doing explicit comparisons against node.type is an anti-pattern.

jridgewell · 2017-06-30T22:03:43Z

packages/babel-plugin-transform-typescript/src/index.js

+            );
+          }
+
+          const _this = t.thisExpression();


You could just inline this.

jridgewell · 2017-06-30T22:05:44Z

packages/babel-plugin-transform-typescript/src/index.js

+
+          const _this = t.thisExpression();
+          const l = t.memberExpression(_this, t.identifier(name));
+          const ass = t.assignmentExpression("=", l, t.identifier(name));


jridgewell · 2017-06-30T22:07:29Z

packages/babel-plugin-transform-typescript/src/index.js

+          ? [statements[0], ...assigns, ...statements.slice(1)]
+          : [...assigns, ...statements];
+
+        function isSuperCall(x: Statement | typeof undefined): boolean {


Hoist please.

jridgewell · 2017-06-30T22:09:41Z

packages/babel-plugin-transform-typescript/src/index.js

+        if (node.returnType) node.returnType = null;
+
+        const p0 = node.params[0];
+        if (p0 && p0.type === "Identifier" && p0.name === "this") {


t.isIdentifier(p0, {name: "this"})

jridgewell · 2017-06-30T22:10:00Z

packages/babel-plugin-transform-typescript/src/index.js

+
+        const p0 = node.params[0];
+        if (p0 && p0.type === "Identifier" && p0.name === "this") {
+          node.params = node.params.slice(1);


Why not just shift it?

jridgewell · 2017-06-30T22:11:27Z

packages/babel-plugin-transform-typescript/src/index.js

+          t.identifier("exports"),
+        );
+        path.replaceWith(
+          t.assignmentExpression("=", moduleExports, path.node.expression),


Should we be generating an export statement instead, so they can transform into whatever their bundler expects?

Actually, it doesn't make a lot of sense to support this feature in babel, especially since we don't have support for import = either. Removed.

hzoo · 2017-07-28T18:27:18Z

packages/babel-core/package.json

@@ -32,7 +32,7 @@
    "babel-template": "7.0.0-alpha.12",
    "babel-traverse": "7.0.0-alpha.12",
    "babel-types": "7.0.0-alpha.12",
-    "babylon": "7.0.0-beta.15",
+    "babylon": "7.0.0-beta.16",


This is set to beta.18 in 7.0 now so can remove these (or just update to 18)

hzoo · 2017-07-28T18:33:09Z

packages/babel-preset-typescript/README.md

+This preset includes the following plugins:
+
+- [transform-typescript](https://babeljs.io/docs/plugins/transform-typescript/)
+- [syntax-object-rest-spread](https://babeljs.io/docs/plugins/syntax-object-rest-spread/)


If we add this, should we add class properties too? Not sure

We just want to enable syntax, not add any transforms. (The syntax should already be enabled via babel-plugin-syntax-typescript.) That way people can have an emit that includes class properties (minus types) if they want to.

oh ok I would of assumed object rest spread was enabled by syntax too

Ok I thought that either babel-plugin-syntax-typescript would just include it there rather than putting it in the preset https://github.com/babel/babel/pull/5899/files#diff-36ceea99653860f193c748d23736fe0aR4

or that babylon would have a similar || check for object spread https://github.com/babel/babylon/blob/c88af90c0a88ec756ad7c27f0a1c6f92bffbcd24/src/parser/statement.js#L1148 - just didn't seem consistent for both class properties and object spread.

Just didn't seem to be necessary to put it in the preset if it can go in the syntax plugin or in babylon; can handle in a followup PR though

hzoo · 2017-07-28T18:33:57Z

packages/babel-traverse/src/visitors.js

@@ -136,7 +136,11 @@ export function verify(visitor) {
    if (shouldIgnoreKey(nodeType)) continue;

    if (t.TYPES.indexOf(nodeType) < 0) {
-      throw new Error(messages.get("traverseVerifyNodeType", nodeType));
+      if (
+        !nodeType.startsWith("TS") // TODO: https://github.com/babel/babel/pull/5856


you already know since this is merged, + merge conflict

existentialism · 2017-08-05T12:42:32Z

packages/babel-plugin-transform-typescript/src/index.js

+        }
+      },
+
+      TSDeclareFunction(path) {


Probably not critical, but Flow types have virtual aliases (i.e. Flow, etc), we may want to do the same here and it would let you replace a bunch of these visitors with:

Typescript(path) { path.remove(); }

Can do this in the follow up PR

The only ones which can be directly removed are TSDeclareFunction, TSDeclareMethod, TSIndexSignature, TSInterfaceDeclaration, and TSTypeAliasDeclaration.
What these all have in common is that they are statements, and are always just declarations (no emit like an enum has).

Nodes like TSAsExpression can't be entirely removed (they contain expressions), and nodes like TSModuleDeclaration require special handling depending on whether they're a type declaration or have a value side too.

If we just added a TypeScript alias it would be confusing why that doesn't include anything else. I could make a TSNonValueDeclaration alias though?

hzoo · 2017-08-07T15:46:56Z

Whoo, thanks @andy-ms!! Time to test it 😄 @DanielRosenwasser

Add babel-plugin-syntax-typescript and babel-plugin-transform-typescript

b3f87a7

hzoo added area: typescript PR: New Feature 🚀 A type of pull request used for our changelog categories labels Jun 28, 2017

Add babel-preset-typescript

dac4069

ghost changed the title ~~Add babel-plugin-syntax-typescript and babel-plugin-transform-typescript~~ Add babel-plugin-syntax-typescript, babel-plugin-transform-typescript, and babel-preset-typescript Jun 28, 2017

This was referenced Jun 29, 2017

Typescript Plugin babel/babylon#320

Closed

babel-plugin-transform-typescript-strip-types #5201

Closed

hzoo reviewed Jun 30, 2017

View reviewed changes

jridgewell reviewed Jun 30, 2017

View reviewed changes

Andy Hanson added 7 commits July 5, 2017 14:19

Remove unnecessary handler for JSXOpeningElement

8bec4c6

Use t.isFoo(node) instead of node.type === "Foo"

fbfe2a4

Clean up parameter property assignment generation

1077ebe

Don't use function for isSuperCall

d60c2c2

slice -> shift

6fd3b7a

Calculate sourceFileHasJsx only if necessary

c50ef53

Remove export = support

e92978a

johansigfrids mentioned this pull request Jul 17, 2017

Extract messages from TypeScript files lingui/js-lingui#48

Closed

hzoo reviewed Jul 28, 2017

View reviewed changes

Merge branch '7.0' into ts-transform

47cb85c

hzoo added this to the Babel 7 milestone Aug 4, 2017

remove some syntax readme newlines [skip ci]

dc88ac4

existentialism reviewed Aug 5, 2017

View reviewed changes

hzoo merged commit e37a5eb into babel:7.0 Aug 7, 2017

ghost deleted the ts-transform branch August 8, 2017 20:39

ghost mentioned this pull request Aug 8, 2017

Move parser plugin from babel-preset-typescript to babel-plugin-syntax-typescript #6070

Merged

ghost mentioned this pull request Aug 8, 2017

Don't enable class properties just because "typescript" plugin is enabled babel/babylon#666

Merged

goodmind mentioned this pull request Aug 16, 2017

Support TypeScript benjamn/recast#424

Closed

zerkalica mentioned this pull request Oct 26, 2017

Поддержка типов в контекстах hyoo-ru/mam_mol#256

Closed

lock bot added the outdated A closed issue/PR that is archived due to age. Recommended to make a new issue label Oct 6, 2019

lock bot locked as resolved and limited conversation to collaborators Oct 6, 2019

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add babel-plugin-syntax-typescript, babel-plugin-transform-typescript, and babel-preset-typescript #5899

Add babel-plugin-syntax-typescript, babel-plugin-transform-typescript, and babel-preset-typescript #5899

ghost commented Jun 28, 2017

mention-bot commented Jun 28, 2017

hzoo commented Jun 28, 2017

hzoo Jun 30, 2017

ghost Jul 5, 2017

jridgewell left a comment

jridgewell Jun 30, 2017

jridgewell Jun 30, 2017

jridgewell Jun 30, 2017

jridgewell Jun 30, 2017

jridgewell Jun 30, 2017

jridgewell Jun 30, 2017

jridgewell Jun 30, 2017

jridgewell Jun 30, 2017

jridgewell Jun 30, 2017

ghost Jul 5, 2017

hzoo Jul 28, 2017

hzoo Jul 28, 2017 •

edited

Loading

ghost Jul 28, 2017 •

edited by ghost

Loading

hzoo Jul 28, 2017

hzoo Aug 7, 2017 •

edited

Loading

hzoo Jul 28, 2017

existentialism Aug 5, 2017

hzoo Aug 7, 2017

ghost Aug 8, 2017 •

edited by ghost

Loading

hzoo commented Aug 7, 2017

Add babel-plugin-syntax-typescript, babel-plugin-transform-typescript, and babel-preset-typescript #5899

Add babel-plugin-syntax-typescript, babel-plugin-transform-typescript, and babel-preset-typescript #5899

Conversation

ghost commented Jun 28, 2017

mention-bot commented Jun 28, 2017

hzoo commented Jun 28, 2017

Choose a reason for hiding this comment

Choose a reason for hiding this comment

jridgewell left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

hzoo Jul 28, 2017 • edited Loading

Choose a reason for hiding this comment

ghost Jul 28, 2017 • edited by ghost Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

hzoo Aug 7, 2017 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

ghost Aug 8, 2017 • edited by ghost Loading

Choose a reason for hiding this comment

hzoo commented Aug 7, 2017

hzoo Jul 28, 2017 •

edited

Loading

ghost Jul 28, 2017 •

edited by ghost

Loading

hzoo Aug 7, 2017 •

edited

Loading

ghost Aug 8, 2017 •

edited by ghost

Loading