Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Types missing due to reference directive bundling #221

Open
kevinkucharczyk opened this issue Sep 7, 2023 · 0 comments
Open

Types missing due to reference directive bundling #221

kevinkucharczyk opened this issue Sep 7, 2023 · 0 comments

Comments

@kevinkucharczyk
Copy link

  • Version: 3.4.4
  • Rollup Version: 3.21.8
  • Operating System and version (if applicable): macOS Ventura 13.4.1
  • Node Version (if applicable): 18.14.1
  • Does it work with tsc (if applicable):

Reproduction

I have a React component, where I import some React types as:

import { type ReactNode } from 'react';

interface ComponentProps {
  children?: ReactNode;
}

...

tsconfig.json is

{
	"include": ["src/*"],
	"compilerOptions": {
		"baseUrl": ".",
		"esModuleInterop": true,
		"strict": true,
		"skipLibCheck": true,
		"jsx": "react-jsx",
		"module": "ESNext",
		"declaration": true,
		"declarationDir": "dist",
		"sourceMap": true,
		"outDir": "dist",
		"moduleResolution": "node",
		"emitDeclarationOnly": true,
		"allowSyntheticDefaultImports": true,
		"forceConsistentCasingInFileNames": true
	}
}

rollup config is:

import commonjs from '@rollup/plugin-commonjs';
import ts from 'rollup-plugin-ts';
import terser from '@rollup/plugin-terser';
import peerDepsExternal from 'rollup-plugin-peer-deps-external';

export default [
	{
		input: 'src/react/index.ts',
		output: [
			{
				file: 'dist-react/cjs/index.js',
				format: 'cjs',
				sourcemap: true,
			},
			{
				file: 'dist-react/esm/index.js',
				format: 'esm',
				sourcemap: true,
			},
		],
		plugins: [
			peerDepsExternal(),
			resolve(),
			commonjs(),
			ts({ tsconfig: './tsconfig.react.json' }),
			terser(),
		],
		external: ['react', 'react-dom'],
	}
];

Expected Behavior

The bundled index.d.ts file should contain the correct types when referencing 3rd party libraries.
It should either be:

/// <reference types="react" />

interface ComponentProps {
  children?: React.ReactNode;
}

export { ComponentProps };

Or provide an option to skip the reference types declaration entirely, and have the .d.ts output be

import { type ReactNode } from 'react';

interface ComponentProps {
  children?: ReactNode;
}

export { ComponentProps };

Actual Behavior

When I run rollup-plugin-ts, the index.d.ts output contains:

/// <reference types="react" />

interface ComponentProps {
  children?: ReactNode;
}

export { ComponentProps };

ReactNode isn't referenced anywhere, and using this component in another repo gives me any types for any props that use React types.

I can use

import React from 'react';

interface ComponentProps {
  children?: React.ReactNode;
}

but I'd prefer not having to import things this way.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant