how to import many vue component to my vue page?

Question

i dont want to write a lot of import from.

import button1 from './components/button1'
import button2 from './componnets/button2'
import table1 from './componnets/table2'
...

Is there any good way to do it quickly? How many way to do this thing？

Answer 1

following this pattern you can dynamically import components as well:

computed: {
  comp () {
      return () => import(`@/components/${this.componentName}.vue`)
  }
}

and then use it like:

<template>
    <component :is="comp"></component>
</template>

Answer 2

You could import and register the Vue Components globally in your index file:

import button1 from './components/button1'

Vue.component('button1', button1);

See the official documentation for more information: https://vuejs.org/v2/guide/components-registration.html#Global-Registration

Answer 3

You may try require.context, look at the example in the official documentation, this should be enough to solve your problem. For more information about require.context, see this question.