How to Exclude node_modules and _virtual from dist/ When Building a vite Package for NPM?

Question

I'm working on a monorepo project using pnpm, Turborepo, and Vite to manage multiple packages. One of my packages (@myorg/ui) generates a dist/ folder during the build process, but the build includes a node_modules folder inside dist/, which I don’t want to publish to NPM or my private registry (Azure Artifacts).

My Current Setup:

Build Tool: Vite (with a vite.config.ts).
Monorepo Tool: Turborepo, to handle dependencies and caching.
Package Manager: pnpm.
Publishing Workflow:
- Clean the project(removes previous builds + dist + node_modules).
- Build with pnpm build (calls Vite to generate the dist/ folder).
- Publish with Changesets (changeset publish).

My Problem:

After building, the dist/ folder contains a node_modules subfolder that I don’t want:

dist/
├── _virtual/
├── components/
├── hooks/
├── node_modules/  <-- I want to exclude this
├── styles/
├── index.d.ts
├── index.mjs
└── style.css

This happens despite configuring rollupOptions.external in my vite.config.ts to exclude dependencies like react and react-dom.

My vite.config.ts:

import path from 'node:path';
import react from '@vitejs/plugin-react';
import { defineConfig } from 'vite';
import dts from 'vite-plugin-dts';

export default defineConfig({
  plugins: [
    react({ jsxRuntime: 'classic' }),
    dts({ insertTypesEntry: true }),
  ],
  build: {
    lib: {
      entry: path.resolve(__dirname, 'src/index.ts'),
      formats: ['es'],
      fileName: (format) => `index.${format}.js`,
    },
    rollupOptions: {
      output: {
        exports: 'named',
        preserveModules: true,
      },
      external: [
        'react',
        'react-dom',
        'next',
        /^next.*/,
        /^@myorg\/utils.*/,
      ],
    },
  },
});

What I've Tried:

.npmignore: Adding dist/node_modules to .npmignore prevents node_modules from being published but doesn’t remove it from the dist/ folder during the build.
Cleaning Scripts: I’ve tried adding custom scripts to clean dist/node_modules after the build, but this feels like a hacky solution.
Vite External Configuration: I ensured rollupOptions.external includes all dependencies, but it doesn’t prevent node_modules from being copied into dist/.

My Question:

How can I configure my build process (Vite or otherwise) to prevent node_modules from being included in the dist/ folder? Is there something I’m missing in my Rollup or Vite configuration?

Additional Details:

Package Manager: pnpm
Monorepo Manager: Turborepo
Tools: Vite, Changesets

NMI · Accepted Answer · 2025-06-15 11:10:52Z

0

quick answer, add the jsx-runtime to the external, e.g

external: [
        'react',
        'react-dom',
        'next',
        /^next.*/,
        /^@myorg\/utils.*/,
        'react/jsx-runtime',
        'react/jsx-dev-runtime'
      ],

jsx-runtime is part of react , apparently for now, its required to explicitly declare the subpath export in the rollupOptions.external

aside: It’s possible to define a .npmignore file, but it will be overridden by the package.json "files" field. To prevent this, place the .npmignore inside the /dist directory so it won’t be overridden.

answered Jun 15 at 11:10

NMI

5385 silver badges8 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to Exclude node_modules and _virtual from dist/ When Building a vite Package for NPM?

My Problem:

My Question:

Additional Details:

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

My Problem:

My Question:

Additional Details:

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related