Last active
September 6, 2021 11:32
-
-
Save rmp135/aca1e54aec3838275b174f0db602467f to your computer and use it in GitHub Desktop.
Import all vue components in a directory
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Use the following to load all vue components in a directory. They will be loaded by the `name` attribute. | |
components: { | |
...(() => { | |
const context = require.context("./components", false, /.*.vue/); | |
return Object.fromEntries( | |
context | |
.keys() | |
.map(k => context(k).default) | |
.filter(c => c.name != undefined) | |
.map(c => [c.name, c]) | |
) | |
})() | |
} |
@robmathews, You are probably using Vue 2+ but it is said that:
This behavior was available pre-Vue 2 via the component array syntax.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Doesn't work for me. It finds and loads the components, but when I try to use the components in my application, I get the error "Failed to mount component: template or render function not defined".
When I import the component explicitly, it all works.
Any idea why?