unplugin-vue-components icon indicating copy to clipboard operation
unplugin-vue-components copied to clipboard

Include option doesn't work as expected with Vue 2

Open taobojlen opened this issue 2 years ago • 0 comments

I'd like to use unplugin-vue-components with a Vue 2 + Vite project. If I simply set transformer: "vue2" in the config, it works great. However, as soon as I try to customize my include to only register certain components, it breaks.

Specifically, here's my vite.config.js:

const { createVuePlugin } = require("vite-plugin-vue2")
import Components from "unplugin-vue-components/vite"

module.exports = {
  plugins: [
    createVuePlugin(),
    Components({
      transformer: "vue2",
      include: [/base-[\w-]+\.vue/i],
    }),
  ],
}

I have a component in src/components/base-button.vue that I want to auto-import. However, with this config, I get the following error in my browser console: Unknown custom element: <base-button> - did you register the component correctly? For recursive components, make sure to provide the "name" option..

I don't understand how the regex is used. If I use /.*/ or the default regexes, the component is included. If I try something that you'd clearly expect to work, like /.*base.*/, it doesn't include anything at all.

Here's a minimal reproduction of the bug: https://github.com/taobojlen/unplugin-vue-components-repro

taobojlen avatar Feb 25 '22 16:02 taobojlen