I have created the react component and trying to create the package of it and publish it. I was testing it with npm link as well as npm install but after compiling it always gives an error :: Module not found. Even though it is present in the node modules.

package.json

{
  "name": "field-input",
  "version": "0.0.1",
  "description": "Input Field Component",
  "main": "dist/index.js",
  "module": "dist/index.mjs",
  "types": "dist/index.d.ts",
  "scripts": {
    "build": "tsup",
    "lint": "tsc"
  },
  "keywords": [
    "react",
    "component",
    "input",
    "field"
  ],
  "author": "fastkit",
  "license": "ISC",
  "peerDependencies": {
    "react": "^18.2.0",
    "react-dom": "^18.2.0"
  },
  "dependencies": {
    "lodash": "^4.17.21",
    "lucide-react": "^0.475.0"
  },
  "devDependencies": {
    "@tailwindcss/postcss": "^4.0.6",
    "@tsconfig/recommended": "^1.0.8",
    "@types/lodash.debounce": "^4.0.9",
    "@types/react": "^18.3.18",
    "@types/react-dom": "^18.3.5",
    "autoprefixer": "^10.4.20",
    "esbuild": "^0.25.0",
    "esbuild-css-modules-plugin": "^3.1.4",
    "postcss": "^8.5.2",
    "tailwindcss": "^4.0.6",
    "tsup": "^8.3.6",
    "typescript": "^5.7.3"
  }
}

tsconfig.ts

{
  "compilerOptions": {
    "strict": true,
    "noImplicitAny": true,
    "esModuleInterop": true,
    "strictNullChecks": true,
    "target": "ESNext",
    "moduleResolution": "node",
    "module": "ESNext",
    "declaration": true,
    "jsx": "react-jsx",
    "outDir": "dist"
  },
  "include": ["src"],
  "exclude": ["node_modules"]
}

tsup.config.ts

import { defineConfig } from "tsup";
export default defineConfig({
  entry: ["src/index.ts"],
  format: ["esm", "cjs"],
  minify: true,
  dts: true,
  outDir: "dist",
  sourcemap: true,
  clean: true,
});

/src/index.ts

import "./index.css";
import FieldInput from "./FieldInput";
export default FieldInput;

/src/Index.tsx

React Component

USAGE

"use client"
import FieldInput from "field-input";
export default function Home() {
  return (
    <div className="">
      <FieldInput label="test"/>
    </div>
  );
}