Intellisense not working when importing custom npm package

20 views Asked by At

I have a custom npm package i created using storybook. The components work fine in other projects when importing them however the intellisense is not working. When i import the same component within storybook the intellisense works fine.

For example take the following component in storybook:

import React from "react";
import { Card as AntCard, CardProps as AntCardProps } from "antd";

interface CardProps extends AntCardProps {
  title: string;
  extra: string;
}

const Card: React.FC<CardProps> = (props) => {
  return <AntCard {...props} />;
};

export default Card;
export type { CardProps };

I am exporting it like following:

export { default as Card } from "./Components/Card";

After building and publishing i am importing in other projects like following:

import Card from 'my-ui-kit';

Again the component works fine but makes it hard for other developers when they don't have access to what props the component has.

typescript Version 5.3.3 react Version 18.2

1

There are 1 answers

3
adsy On

This is an indicator that perhaps one or more of the following is true:

  • You may have forgotten to add "declaration": true to your tsconfig.json so that when the package is built using tsc, it creates .d.ts files. And those will also be published. If you don't use tsc to build, you will need to execute run it after/before whatever your build pipeline is with emitDeclarationOnly set.
  • You may have forgotten to add a "types": "<path to .d.ts entry file>" line to your package.json so that consuming packages know where the type declarations are.

It's hard to tell but there are some indicators of possible confusion about how to distribute a lib. Typically your published module would be built using any number of build tools. Storybook itself does not usually constitute a build tool (outside of the build process it uses to serve itself, which is supposed to be independent of your own build tooling for compiling the lib for distribution, rather than actually being it) and would in an of itself not form part of any published tarball. If you show your publish/build pipeline and your package.json I may be able to edit with more specifics.