Why do I get a 'TypeError: Cannot read properties of null (reading 'useState')' error when installing my React UI package through an absolute path?

I have written a ui package for react and I am compiling them through rollup package manager. When I publish to my personal bitbucket repo and install them from the cloud eg: npm i https:lik-to-the-repo the package works fine but when I am doing an install it through the absolute path eg; `npm i / Users/myname/Projects/Work/project-name".

I am using external: [/node_modules/] to let rollup know that all all my packages are external and should imported on the run-time.

But it works fine when i pack my package using npm pack and link the packed file in my repo ie. 'file:../pack-dir/pack-name.tgz'

I am facing this error

TypeError: Cannot read properties of null (reading 'useState')
    at Object.useState (http://localhost:5173/node_modules/.vite/deps/chunk-ONATIWGS.js?v=e6bdb091:1066:29)

The project directory I specify for npm to install is where my package.json file exists. Inside /Work/project-name/package.json, It successfully installs my package in node_modules with the name specified in my package.json

Added the entry path in package.json

    "main": "dist/index.cjs",
    "module": "dist/index.js",
    "files": [
        "dist"
    ],
    "types": "dist/index.d.ts",
    "peerDependencies": {
        "react": "^18.0.0",
        "react-dom": ">=16.6.0"
    },

my roll-up config

export default [
  {
    input: 'src/index.ts',
    output: [
      {
        dir: 'dist',
        format: 'cjs',
        entryFileNames: '[name].cjs',
        exports: 'auto',
        ...outputOptions,
      },
      {
        dir: 'dist',
        format: 'esm',
        ...outputOptions,
      },
    ],
    external: [/node_modules/],
    plugins: [
      peerDepsExternal({ includeDependencies: true }),
      resolve(),
      commonjs(),
      preserveDirectives(),
      terser(),
      typescript({
        tsconfig: './tsconfig.json',
        exclude: [
          'node_modules',
          'src/icons',
          '**/icons/**',
          '**/examples/**',
          '**/stories/**',
          '**/*/stories/**',
          '**/tests/**',
          './styles.css',
          '**/*.stories.ts',
          '**/*.stories.tsx',
        ],
      }),
      typescriptPaths(),
    ],
  },
  //   Icons
  {
    input: 'src/icons/index.ts',
    output: [
      {
        dir: 'dist/icons',
        format: 'cjs',
        entryFileNames: '[name].cjs',
        exports: 'auto',
        preserveModules: true,
      },
      {
        dir: 'dist/icons',
        format: 'esm',
        preserveModules: true,
      },
    ],
    external: [/node_modules/],
    plugins: [
      resolve(),
      peerDepsExternal({ includeDependencies: true }),
      commonjs(),
      preserveDirectives(),
      terser(),
      typescript({
        tsconfig: './tsconfig.json',
        declarationDir: 'dist/icons',
        rootDir: 'src/icons',
        exclude: [
          '**/examples/**',
          '**/stories/**',
          '**/*/stories/**',
          '**/tests/**',
          './styles.css',
          '**/*.stories.ts',
          '**/*.stories.tsx',
        ],
      }),
      //   typescriptPaths(),
    ],
  },
  {
    input: 'src/assets/scss/imports.scss',
    output: [
      {
        file: 'dist/lib-ui.css',
      },
    ],
    plugins: [
      postcss({
        plugins: [postcssImport()],
        extract: path.resolve('dist/lib-ui.css'),
        minimize: true,
        modules: false,
      }),
    ],
  },
  {
    input: 'dist/index.d.ts',
    output: [{ file: 'dist/index.d.ts', format: 'esm' }],
    plugins: [dts()],
    external: [/\.css$/, /\.scss$/],
  },
];

I tried using npm link then too I face the same issue. I am using react with vite and swc modules.

from the error i can see something is wrong with react/JSX syntax

this makes me come a couple of doubts:

• every react dependency is correctly installed in your project "project-name"?

• don't you have to use the react() plugin too?

   import react from '@rollup/plugin-react'
  
   plugins:[
     react(),
   ],