TypeError: svgPlugin is not a function

[hanayashiki]

In vite 3.0.5, I'm trying the following configuration:

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'
import svgPlugin from "vite-plugin-fast-react-svg"

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [react(), svgPlugin()],
})

And got the following error:

pnpm dev      

> d2d-zendesk@0.0.0 dev /Users/chenyuwang/d2d-zendesk
> vite

failed to load config from /Users/chenyuwang/d2d-zendesk/vite.config.ts
error when starting dev server:
TypeError: svgPlugin is not a function
    at file:///Users/chenyuwang/d2d-zendesk/vite.config.ts.timestamp-1660055940946.mjs:6:22
    at ModuleJob.run (node:internal/modules/esm/module_job:198:25)
    at async Promise.all (index 0)
    at async ESMLoader.import (node:internal/modules/esm/loader:409:24)
    at async loadConfigFromBundledFile (file:///Users/chenyuwang/d2d-zendesk/node_modules/.pnpm/vite@3.0.5/node_modules/vite/dist/node/chunks/dep-5cb728cb.js:62986:21)
    at async loadConfigFromFile (file:///Users/chenyuwang/d2d-zendesk/node_modules/.pnpm/vite@3.0.5/node_modules/vite/dist/node/chunks/dep-5cb728cb.js:62872:28)
    at async resolveConfig (file:///Users/chenyuwang/d2d-zendesk/node_modules/.pnpm/vite@3.0.5/node_modules/vite/dist/node/chunks/dep-5cb728cb.js:62486:28)
    at async createServer (file:///Users/chenyuwang/d2d-zendesk/node_modules/.pnpm/vite@3.0.5/node_modules/vite/dist/node/chunks/dep-5cb728cb.js:59089:20)
    at async CAC.<anonymous> (file:///Users/chenyuwang/d2d-zendesk/node_modules/.pnpm/vite@3.0.5/node_modules/vite/dist/node/cli.js:699:24)
 ELIFECYCLE  Command failed with exit code 1.

It seems the export default is transpiled as

exports.default = svgPlugin;

Which breaks how we handle esm vite.config.ts

[ArnaudBarre]

Thanks for reporting. I published a breaking version (0.2.0) which avoid the very bad handling of node CJS imports from ESM.

[hanayashiki]

Thanks for reporting. I published a breaking version (0.2.0) which avoid the very bad handling of node CJS imports from ESM.

I think maybe we could publish both esm and cjs versions

[ArnaudBarre]

For complex libs I think this is the only solution, but for a one file lib it's a bit frustrating to take the time to setup this.
Node esm is able to parse cjs, just not default export, and avoiding it is not an issue IMO