vite-plugin-external

The vite-plugin-external provides a way of excluding dependencies from the runtime code and output bundles.

Installation

npm install vite-plugin-external --save-dev

Options

externals: [packageName: string]: any
development?: Options
production?: Options
cwd?: string - default: process.cwd()
cacheDir?: string - default: join(cwd, 'node_modules', '.vite_external')

Usage

<script src="
//cdn.jsdelivr.net/npm/react@16.14.0/umd/react.production.min.js"></script>

import createExternal from 'vite-plugin-external';

export default defineConfig({
  plugins: [
    createExternal({
      externals: {
        react: 'React'
      }
    })
  ],
  build: {
    cssCodeSplit: false,
    rollupOptions: {
      output: {
        manualChunks: undefined,
        assetFileNames: 'assets/[name][extname]',
        entryFileNames: '[name].js',
        format: 'iife'
      }
    }
  }
});

Override externals by mode

<script src="
//g.alicdn.com/linkdesign/lib/1.0.1/~react.js"></script>

import createExternal from 'vite-plugin-external';

export default defineConfig({
  plugins: [
    createExternal({
      externals: {
        react: 'React'
      },
      development: {
        externals: {
          react: '$linkdesign.React'
        }
      }
    })
  ]
});

Examples

Demo