# Vue 2, use a component inside another component

> Learn how to import and use a Vue 2 component inside another, by importing the .vue file in the script tag and registering it in the components option.

Author: [Flavio Copes](https://flaviocopes.com/about/) | Published: 2018-06-22 | Topics: [Vue.js](https://flaviocopes.com/tags/vue/) | Canonical: https://flaviocopes.com/vue-import-component/

Say you have a Pixel component in `src/components/Pixel.vue`

In another component, Canvas, which is located in `src/components/Canvas.vue`, you can import that Pixel component by importing it inside the `script` tag of the [Vue](https://flaviocopes.com/vue-introduction/) Single File Component:

```html
<template>
  <p>Canvas</p>
  <Pixel />
</template>

<script>
import Pixel from './Pixel'

export default {
  name: 'App',
  components: {
    Pixel
  }
}
</script>
```