Skip to content

Instantly share code, notes, and snippets.

@Gkiokan
Created May 9, 2019 11:02
Show Gist options
  • Save Gkiokan/3fbeb12bfc50072961389e202a040c97 to your computer and use it in GitHub Desktop.
Save Gkiokan/3fbeb12bfc50072961389e202a040c97 to your computer and use it in GitHub Desktop.
Autoload *.vue files as Component and register them
/*
Autoload all current vue files as component and register them by their name.
---
Author: Gkiokan Sali
Date: 2019-05-09
*/
import Vue from 'vue'
const requireContext = require.context('./', false, /.*\.vue$/)
const layouts = requireContext.keys()
.map(file =>
[file.replace(/(^.\/)|(\.vue$)/g, ''), requireContext(file)]
)
.reduce((components, [name, component]) => {
let Component = component.default || component
Vue.component(Component.name, Component)
}, {})
@Gkiokan
Copy link
Author

Gkiokan commented Sep 22, 2021

for vue 3 use this

/*
    Autoload all current vue files as component and register them by their name.
    ---
    Author: Gkiokan Sali
    Date: 2021-09-22
*/

// import Vue from 'vue'
import { createApp } from 'vue'
const app = createApp({})

const requireContext = require.context('./', false, /.*\.vue$/)
const layouts = requireContext.keys()
  .map(file =>
    [file.replace(/(^.\/)|(\.vue$)/g, ''), requireContext(file)]
  )
  .reduce((components, [name, component]) => {
    let Component = component.default || component
    app.component(Component.name, Component)
  }, {})

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment