[api-extractor] types are exported as 'import' clause instead of the imported symbol

[CarstenLeue]

I have an interface such as this:

import { authoringContentReducer } from './auth.content.reducer';

export const AUTH_CONTENT_FEATURE = 'authContent';

export const authContentFeatureReducer = {
  [AUTH_CONTENT_FEATURE]: authoringContentReducer
};

with

import { Reducer } from 'redux';
...

export const authoringContentReducer: Reducer<
  AuthoringContentState,
  | AddAuthoringContentAction
  | SetAuthoringContentAction
  | RemoveAuthoringContentAction
> = ...;

the authContentFeatureReducer is appears in the api export as

        {
          "kind": "Variable",
          "canonicalReference": "authContentFeatureReducer",
          "docComment": "",
          "excerptTokens": [
            {
              "kind": "Reference",
              "text": "authContentFeatureReducer"
            },
            {
              "kind": "Content",
              "text": ": "
            },
            {
              "kind": "Content",
              "text": "{\n    ["
            },
            {
              "kind": "Reference",
              "text": "AUTH_CONTENT_FEATURE"
            },
            {
              "kind": "Content",
              "text": "]: import(\"redux\")."
            },
            {
              "kind": "Reference",
              "text": "Reducer"
            },

i.e. the reference to the Reducer type from redux is includes as an import in the type declaration instead of just using the Reducer value.

This is in particular problematic in the documentation generated from this structure, the fully rendered doc in my example is:

authContentFeatureReducer: {
    [AUTH_CONTENT_FEATURE]: import("redux").Reducer<Record<string, import("@ibm-wch-sdk/api").AuthoringContentItem>, import("..").PayloadAction<import("@ibm-wch-sdk/api").AuthoringContentItem> | import("..").PayloadAction<string>>;
}

which is basically unreadable.

I would have preferred the types to be referenced (and in particular documented) just by their name, not their import path.

[octogonz]

What do you see in your .d.ts files? I suspect the compiler is performing this transformation, not API Extractor. Also, which version of the compiler are you using?

[CarstenLeue]

Indeed the .d.ts files look strange, already:

export declare const authContentFeatureReducer: { [AUTH_CONTENT_FEATURE]: import("redux").Reducer<Record<string, import("@ibm-wch-sdk/api").AuthoringContentItem>, import("..").PayloadAction<import("@ibm-wch-sdk/api").AuthoringContentItem> | import("..").PayloadAction<string>>; };
I am using typescript@3.2.4 and ng-packagr to actually execute the build.

Is this something that can be configured on the tsconfig level?

[octogonz]

I think this is an aspect of the compiler that could be improved. I would encourage you to open a GitHub issue for the TypeScript project, and first check whether anyone else has reported it if any workarounds are known.

I remember that I encountered the same problem with one of the API Extractor APIs and was able to eliminate it by simplifying the type expressions. It involved a new language feature that was just introduced in TS 3.x, so maybe the emitter is not optimized yet.

We could try to fix it up in API Extractor, but really the compiler needs to generate human readable .d.ts files in my opinion.

[weeebdev]

Any workarounds about this?