Answers for "how to import components in vue"

7

vuejs import component

<template>
  <your-component></your-component>
</template>

<script>
  import YourComponent from '../components/YourComponent.vue'
  
  export default {
	components: {
      YourComponent // <=> YourComponent: 'YourComponent'
    }	
  };
</script>

<!-- OR -->

<script>
  export default {
	components: {
      YourComponent: () => import('your/component/path')
    }
  }
</script>
Posted by: Guest on December-21-2020
1

vue component import

<template>
	<Component-a></Component-a>
</template>

<script>
import ComponentA from './ComponentA.vue'

export default {
  components: {
    ComponentA
  }
  // ...,
}
</script>

<!-- Another way -->

<template>
  <!-- For client side rendering -->
  <client-only>
	<Component-a></Component-a>
  </client-only>
</template>

<script>
  export default {
	components: {
      // Dynamic import for client side rendering (you can use normaly also)
      ComponentA: () => import('./ComponentA.vue')
    }
  }
</script>
Posted by: Guest on October-22-2021
8

vue import component

// With Vue 3.2 
<script setup>
import Btn from './components/Btn'
</script>

<template>
  <Btn />
</template>
Posted by: Guest on November-02-2020

Code answers related to "how to import components in vue"

Browse Popular Code Answers by Language