Components not tree shaking in library mode

[mdoesburg]

@underfin First of all, thank you for your great work on this plugin and other open source projects!

I am attempting to create a component library with Vite (library mode) & Vue 2, but whenever I check the build output of a test app that consumes the library, all components get included in the final build even unused ones.

Here's a snippet of the build in development mode:

/***/ "../vite-example-lib/dist/vite-example-lib.es.js":
/*!*******************************************************!*\
  !*** ../vite-example-lib/dist/vite-example-lib.es.js ***!
  \*******************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "Vite1": () => (/* binding */ __vue_component__$1)
/* harmony export */ });
/* unused harmony exports Vite2, testUtil1, testUtil2 */

Exports correctly get marked as unused, but don't get removed in the final production build.

I am fairly certain that it has something to do with this plugin. Whenever I use the default Vite setup with Vue 3, everything gets tree shaken properly. If I use rollup-plugin-vue instead of vite-plugin-vue2, everything gets tree shaken properly. Only when I use this plugin all components always get included in the final build of the consuming test app.

Hopefully I am missing some basic configuration or there's an easy fix for this, because I would love to use this plugin to create a library with Vite & Vue 2.

package.json

{
  "name": "vite-example-lib",
  "version": "0.0.0",
  "files": [
    "dist"
  ],
  "main": "./dist/vite-example-lib.umd.js",
  "module": "./dist/vite-example-lib.es.js",
  "exports": {
    ".": {
      "import": "./dist/vite-example-lib.es.js",
      "require": "./dist/vite-example-lib.umd.js"
    }
  },
  "sideEffects": false,
  "scripts": {
    "dev": "vite",
    "build": "vite build"
  },
  "dependencies": {
    "vue": "^2.6.14"
  },
  "devDependencies": {
    "vite": "^2.4.0",
    "vite-plugin-vue2": "^1.7.2",
    "vue-template-compiler": "^2.6.14"
  }
}

vite.config.js

import { defineConfig } from 'vite'
import { createVuePlugin } from 'vite-plugin-vue2'
import path from 'path'

// https://vitejs.dev/config/
export default defineConfig({
  resolve: {
    alias: [
      {
        find: '@',
        replacement: path.resolve(__dirname, 'src'),
      },
    ],
  },
  plugins: [
    createVuePlugin()
  ],
  build: {
    lib: {
      entry: path.resolve(__dirname, 'src/index.js'),
      name: 'ViteExampleLib'
    },
    rollupOptions: {
      // make sure to externalize deps that shouldn't be bundled
      // into your library
      external: ['vue'],
      output: {
        // Provide global variables to use in the UMD build
        // for externalized deps
        globals: {
          vue: 'Vue'
        }
      }
    }
  }
})

index.js

export { default as Vite1 } from '@/components/Vite1.vue';
export { default as Vite2 } from '@/components/Vite2.vue';

export const testUtil1 = () => 'testUtil1';

export const testUtil2 = () => 'testUtil2';

Vite1.vue

<template>
  <h1>Vite1</h1>
</template>

<script>
export default {
    name: 'Vite1'
}
</script>

Vite2.vue

<template>
  <h1>Vite2</h1>
</template>

<script>
export default {
    name: 'Vite2'
}
</script>

[mdoesburg]

Could it have something to do with the normalizeComponent function? Similar to this issue: https://github.com/vuejs/rollup-plugin-vue/issues/344

[mdoesburg]

I opened a PR with a fix: https://github.com/underfin/vite-plugin-vue2/pull/105