Provide typings for ESM (TS error when using `moduleResolution` `node16` or `nodenext`)

[Llois41]

Hey there,

first of all I'm exited to use this Plugin after seeing the presentation on VueJS Amsterdam this week. :)

I think this Plugin has a similar issue as mentioned in vitejs/vite#10481 because I get the same error TS2349: This expression is not callable.   Type 'typeof import("<...>/node_modules/unplugin-vue-router/dist/vite")' has no call signatures.

A current workaround is declaring the correct typings myself

declare module 'unplugin-vue-router/vite' {
    import { type Plugin } from 'vite';
    import { type Options } from 'unplugin-vue-router/options';
    
    const plugin: (options?: Options) => Plugin;
    export default plugin;
}

My Project files:

// tsconfig.json
{
  "compilerOptions": {
    "target": "esnext",
    "module": "nodenext",
    "moduleResolution": "nodenext",
    "outDir": "build/js",
    "noUnusedLocals": true
  }
}

// package.json
{
  "name": "my-project",
  "version": "0.0.1",
  "type": "module",
  "packageManager": "yarn@3.3.1",
  "scripts": {...},
  "dependencies": {
    "vue": "3.2.47",
    "vue-router": "4.1.6"
  },
  "devDependencies": {
    "@vitejs/plugin-vue": "4.0.0",
    "@vue/test-utils": "2.2.10",
    "jsdom": "21.1.0",
    "typescript": "4.9.5",
    "unplugin-vue-router": "0.3.2",
    "vite": "4.1.1",
    "vitest": "0.28.4"
  }
}

[Llois41]

Also getting multiple errors when I try to compile my project after generating the typed routes:

I really can't get my head wrapped around the TypeScript-Node-ESM-CJS stuff so maybe it's just the state of all those frameworks/libraries (not) working together.

[unshame]

Try adding "type": "module" to your package.json.

[Llois41]

Try adding "type": "module" to your package.json.

It's already in there ;)

I will try to make use of TS 5.0 new "moduleResolution": "bundler". And also compiling the dependencies is not the best idea, I will try out skipLibChecks.