Typescript: Erroneous specifiers in declaration files.

[TejasQ]

TypeScript Version: 3.0.1

Search Terms: import, eac

Code

// A *self-contained* demonstration of the problem follows...
// Test this by running `tsc` on the command-line, rather than through another build tool such as Gulp, Webpack, etc.
import styled from "react-emotion"

const Form = styled('div')({ color: "red" })

export default Form

Expected behavior:
When run with --declaration, the output I expected was:

import * as React from "react";
export declare const Form: import("create-emotion-styled/types/react").StyledOtherComponent<{}, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, any>;
export default Form;

Actual behavior:
When run with --declaration, the generated .d.ts file contains:

/// <reference path="../../node_modules/create-emotion/types/index.d.ts" />
/// <reference types="react" />
export declare const Form: import("create-emotion-styled/types/react").StyledOtherComponent<{}, import("eac").DetailedHTMLProps<import("eac").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, any>;
export default Form;

What's really strange is import("eac"). Where in the world is this coming from? 🤔

Playground Link:
I can't add a playground link because it depends on import.

Related Issues: https://github.com/emotion-js/emotion/issues/788

[weswigham]

If I had to guess: "eac" is the middle 3 characters of "react" and we're trimming the leading and trailing characters expecting them to be quotations (ambient modules are supposed to always be quoted), but they're not. 😄

[michael8090]

awesome!