# Can I use local components

**URL:** <https://discuss.emberjs.com/t/can-i-use-local-components/14899>\
**Category:** Ember CLI\
**Created:** [June 6, 2018, 11:53am UTC](https://discuss.emberjs.com/t/can-i-use-local-components/14899 "2018-06-06T11:53:28Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![staale](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/staale/32/9501_2.png) [@staale](https://discuss.emberjs.com/u/staale)\
**Post date:** [June 6, 2018, 11:53am UTC](https://discuss.emberjs.com/t/can-i-use-local-components/14899/1 "2018-06-06T11:53:28Z")

</div>

I am trying to figure out how to use local components. My motivation is that our app source is already pretty large, and our components/ folder is pretty cluttered. I want to create a component that will only be used in a single route.

I have tried to read up on the various posts, but nothing seems to work. I have created the component as such:

```
details/
    route.js
    controller.js
    template.hbs
    components/my-component/
        component.js
        template.hbs

```

However, the component is not found. Digging through the source of the resolver and ember, there seems to be a need for a method called expandLocalLookup, and I see that it’s defined within ember-resolver under mu-trees, but I am not sure how that gets included.

This posts indicates that it should be possible (1 year old):

[https://madhatted.com/2017/7/12/embercamp-module-unification-update](https://madhatted.com/2017/7/12/embercamp-module-unification-update)

There is also some blueprint in ember-cli: [https://github.com/ember-cli/ember-cli/tree/v3.1.4/blueprints/module-unification-app](https://github.com/ember-cli/ember-cli/tree/v3.1.4/blueprints/module-unification-app)

But the blueprint mentioned in the blog post doesn’t work and I don’t know how to use the module-unification-app blueprint.

Is there any way for me to get the above component to work in Ember 3.1.4 using ember-resolver 4.5.0?

---

<div class="post-metadata">

**Author:** ![ryanto](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/ryanto/32/13850_2.png) [@ryanto](https://discuss.emberjs.com/u/ryanto)\
**Post date:** [June 6, 2018, 3:14pm UTC](https://discuss.emberjs.com/t/can-i-use-local-components/14899/2 "2018-06-06T15:14:44Z")

</div>

We do this by using the full component path.

```nohighlight
{{details/components/my-component}}

```

It’s not as nice as having relative components, but it allows us to keep our components/ folder less cluttered. In fact, the only components that exist in app/components/ are global components. All other components we have nested within pods.