React component imports was removed.

[yhorbachov]

TypeScript Version: 2.3.2
Version 2.3.2 removes imports of react components if you use them only in JSX(TSX).

Code

import * as React from "react";

import { TitleComponent } from './title.component.tsx';
import { BodyComponent } from './body.component.tsx';

export default function render(Router:any, routerArgs) {
  return (
    <Router {...routerArgs}>
      <div>
        <div>
          <TitleComponent />
        </div>
        <div>
          <BodyComponent />
        </div>
      </div>
    </Router>
  );
}

Compiled with 2.3.2

"use strict";
var __assign = (this && this.__assign) || Object.assign || function(t) {
    for (var s, i = 1, n = arguments.length; i < n; i++) {
        s = arguments[i];
        for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
            t[p] = s[p];
    }
    return t;
};
Object.defineProperty(exports, "__esModule", { value: true });
var React = require("react");
function render(Router, routerArgs) {
    return (React.createElement(Router, __assign({}, routerArgs),
        React.createElement("div", null,
            React.createElement("div", null,
                React.createElement(title_component_tsx_1.TitleComponent, null)),
            React.createElement("div", null,
                React.createElement(body_component_tsx_1.BodyComponent, null)))));
}
exports.default = render;

As you can see import was removed from compiled JS, but if i assign these components to a variable - everything works fine.

import * as React from "react";

import { TitleComponent } from './title.component.tsx';
import { BodyComponent } from './body.component.tsx';

const a = TitleComponent;
const b = BodyComponent;

export default function render(Router:any, routerArgs) {
  return (
    <Router {...routerArgs}>
      <div>
        <div>
          <TitleComponent />
        </div>
        <div>
          <BodyComponent />
        </div>
      </div>
    </Router>
  );
}

compiles into

"use strict";
var __assign = (this && this.__assign) || Object.assign || function(t) {
    for (var s, i = 1, n = arguments.length; i < n; i++) {
        s = arguments[i];
        for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
            t[p] = s[p];
    }
    return t;
};
Object.defineProperty(exports, "__esModule", { value: true });
var React = require("react");
var title_component_tsx_1 = require("./title.component.tsx");
var body_component_tsx_1 = require("./body.component.tsx");
var a = title_component_tsx_1.TitleComponent;
var b = body_component_tsx_1.BodyComponent;
function render(Router, routerArgs) {
    return (React.createElement(Router, __assign({}, routerArgs),
        React.createElement("div", null,
            React.createElement("div", null,
                React.createElement(title_component_tsx_1.TitleComponent, null)),
            React.createElement("div", null,
                React.createElement(body_component_tsx_1.BodyComponent, null)))));
}
exports.default = render;

Version 2.3.0 works fine even without assigning to dummy vars, so it looks like regression.

Compiled with 2.3.0

"use strict";
var __assign = (this && this.__assign) || Object.assign || function(t) {
    for (var s, i = 1, n = arguments.length; i < n; i++) {
        s = arguments[i];
        for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
            t[p] = s[p];
    }
    return t;
};
Object.defineProperty(exports, "__esModule", { value: true });
var React = require("react");
var title_component_tsx_1 = require("./title.component.tsx");
var body_component_tsx_1 = require("./body.component.tsx");
function render(Router, routerArgs) {
    return (React.createElement(Router, __assign({}, routerArgs),
        React.createElement("div", null,
            React.createElement("div", null,
                React.createElement(title_component_tsx_1.TitleComponent, null)),
            React.createElement("div", null,
                React.createElement(body_component_tsx_1.BodyComponent, null)))));
}
exports.default = render;

Expected behavior:
To have

var title_component_tsx_1 = require("./title.component.tsx");
var body_component_tsx_1 = require("./body.component.tsx");

Actual behavior:
Import of components was removed from compiled file.

[mhegazy]

Duplicate of #15469. should be fixed in TS 2.3 (out later this week). the fix should already be in typescript@next please give it a try and let us know if you still running into issues.

[yhorbachov]

Confirm, typescript@next has no this issue.