Import error with webpack

[Eliot00]

node:internal/modules/esm/resolve:853
  throw new ERR_MODULE_NOT_FOUND(packageName, fileURLToPath(base), null);
        ^

Error [ERR_MODULE_NOT_FOUND]: Cannot find package 'vite' imported from /Volumes/Extra/Code/conditional/node_modules/.pnpm/unplugin-preprocessor-directives@1.0.3/node_modules/unplugin-preprocessor-directives/dist/chunk-C3KB5XGL.js
    at packageResolve (node:internal/modules/esm/resolve:853:9)
    at moduleResolve (node:internal/modules/esm/resolve:910:20)
    at defaultResolve (node:internal/modules/esm/resolve:1130:11)
    at ModuleLoader.defaultResolve (node:internal/modules/esm/loader:396:12)
    at ModuleLoader.resolve (node:internal/modules/esm/loader:365:25)
    at ModuleLoader.getModuleJob (node:internal/modules/esm/loader:240:38)
    at ModuleWrap.<anonymous> (node:internal/modules/esm/module_job:85:39)
    at link (node:internal/modules/esm/module_job:84:36) {
  code: 'ERR_MODULE_NOT_FOUND'
}

Node.js v20.11.1
 ELIFECYCLE  Command failed with exit code 1.
       Error The "beforeDevCommand" terminated with a non-zero status code.

nextjs config:

/** @type {import('next').NextConfig} */
import PreprocessorDirectives from 'unplugin-preprocessor-directives/webpack'

const nextConfig = {
    output: 'export',
    webpack: (config) => {
        config.plugins = config.plugins || []
        config.plugins.push(new PreprocessorDirectives({}))
        return config
    }
};

export default nextConfig;

[Eliot00]

unplugin-preprocessor-directives/webpack.d.ts:

import * as webpack from 'webpack';
import { U as UserOptions } from './types-AxT-ueK5.js';
import 'vite';
import 'magic-string';

declare const _default: (options?: UserOptions | undefined) => webpack.WebpackPluginInstance;

export { _default as default };

why import 'vite'?