Giters

wessberg / rollup-plugin-ts

A TypeScript Rollup plugin that bundles declarations, respects Browserslists, and enables seamless integration with transpilers such as babel and swc

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

ES6 Re-exports doesn't resolve inner types

diego-toro opened this issue · comments

commented

Hi there! Need some help with this plugin setup as I'm not able to get proper types. Not sure if it's the plugin or a typescript config.

I'm trying to create a react component library with components namely exported from an entry file and each of them re-exported by their own barrel:

├── src
│   ├── Foo
│   │   ├── Foo.tsx
│   │   └── index.ts
│   ├── Bar
│   │   ├── Bar.tsx
│   │   └── index.ts
└── index.ts

And after compiling get two files: index.js and index.d.ts. But the d.ts file does not include the inner component types. It's just a single line with an export.

export { default as Bar, default as Foo };

Reproduction

By having a project set up like:

// Foo/Foo.tsx
import { FC } from "react";

const Foo: FC<{
  name: string;
}> = ({ name }) => <h2>Foo {name}</h2>;

export default Foo;

// Foo/index.ts
export { default } from "./Foo";

// index.ts
export { default as Foo } from "./Foo";
// rollup.config.js
import ts from "rollup-plugin-ts";

export default {
  input: "./src/index.ts",
  output: {
    dir: "./build",
    format: "es",
  },
  external: ["react/jsx-runtime"],
  plugins: [ts()],
};

Results in a in a d.ts file like:

export { default as Foo };

But if instead of using re-export use import and then export works fine.

// Foo/index.ts
import Foo from "./Foo";
export default Foo

Expected Result

import { FC } from 'react';

interface BarProps {
    lastName: string;
}
declare const Bar: FC<BarProps>;

interface HelloWorldProps {
    name: string;
}
declare const Foo: FC<HelloWorldProps>;

export { Bar, Foo };

Actual Results

export { default as Bar, default as Foo };

Environment

commented

Hey there. This problem has been fixed in v2.0.6

commented

@wessberg thank you very much! Just saw an issue tho. The resulting d.ts have some extra defaults aliases. Not sure if its intentional.

import { FC } from "react";
interface BarProps {
    lastName: string;
}
declare const Bar: FC<BarProps>;
declare const __default: typeof Bar;  // <== This one
interface HelloWorldProps {
    name: string;
}
declare const Foo: FC<HelloWorldProps>;
declare const __default$0: typeof Foo;  // <== This one
export { __default as Bar, __default$0 as Foo };

Also seems the watch mode breaks when editing style files. Just updated the sample repo to include postcss. Here is the error that pops up after trying to edit the .module.scss on watch mode

[!] (plugin Typescript) TypeError: Cannot read properties of null (reading 'length')
TypeError: Cannot read properties of null (reading 'length')
    at iterateCommentRanges (/Users/diegotoro/code/rollup-ts-reexport-bug/node_modules/typescript/lib/typescript.js:10470:45)
    at reduceEachLeadingCommentRange (/Users/diegotoro/code/rollup-ts-reexport-bug/node_modules/typescript/lib/typescript.js:10561:16)
    at Object.getLeadingCommentRanges (/Users/diegotoro/code/rollup-ts-reexport-bug/node_modules/typescript/lib/typescript.js:10576:16)
    at Object.getJSDocCommentRanges (/Users/diegotoro/code/rollup-ts-reexport-bug/node_modules/typescript/lib/typescript.js:15302:16)
    at addJSDocComment (/Users/diegotoro/code/rollup-ts-reexport-bug/node_modules/typescript/lib/typescript.js:31050:42)
    at parseSourceFileWorker (/Users/diegotoro/code/rollup-ts-reexport-bug/node_modules/typescript/lib/typescript.js:31023:34)
    at Object.parseSourceFile (/Users/diegotoro/code/rollup-ts-reexport-bug/node_modules/typescript/lib/typescript.js:30855:26)
    at Object.createSourceFile (/Users/diegotoro/code/rollup-ts-reexport-bug/node_modules/typescript/lib/typescript.js:30653:29)
    at CompilerHost.constructSourceFile (/Users/diegotoro/code/rollup-ts-reexport-bug/node_modules/rollup-plugin-ts/dist/cjs/index.js:7700:37)
    at CompilerHost.add (/Users/diegotoro/code/rollup-ts-reexport-bug/node_modules/rollup-plugin-ts/dist/cjs/index.js:7660:37)
commented

Hi there. Yes, these are intentional and part of how exported bindings are aliased locally when brought together. The output in your example is exactly as intended. A little verbose, sure, but only something you'll see rarely when re-exporting default exports from other modules under other names.

As for the second part of your question about watch mode , I'll look into it and see what if I can make sense if it, but it would be great if we could track it in a separate issue ☺️

commented

sure! I'll open a new one. Thanks!

commented

I've managed to track down and isolate the problem. It is a regression in the new version. Thanks for letting me know this early before anyone else runs into it!

commented

That's awesome! and... Oh shut. Just filed a new issue for it #178 You can close it right away.

commented

That's great, I'll point to that issue in the release notes.