# JS-only components in Aurelia 2

**URL:** <https://discourse.aurelia.io/t/js-only-components-in-aurelia-2/4438>\
**Category:** vNext\
**Created:** [October 14, 2021, 1:42pm UTC](https://discourse.aurelia.io/t/js-only-components-in-aurelia-2/4438 "2021-10-14T13:42:36Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![WizardofOz](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/wizardofoz/32/989_2.png) [@WizardofOz](https://discourse.aurelia.io/u/WizardofOz)\
**Post date:** [October 14, 2021, 1:42pm UTC](https://discourse.aurelia.io/t/js-only-components-in-aurelia-2/4438/1 "2021-10-14T13:42:36Z")

</div>

I’m trying to use Aurelia 2 with the enhance API, but due to platform restrictions I can’t deploy HTML files. I know Aurelia 1 had the `@inlineView` decorator, but I couldn’t find an equivalent in the 2nd version.

Is there currently a way to define views without using HTML files in Aurelia 2?

---

<div class="post-metadata">

**Author:** ![zewa666](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/zewa666/32/19_2.png) [@zewa666](https://discourse.aurelia.io/u/zewa666)\
**Post date:** [October 14, 2021, 1:46pm UTC](https://discourse.aurelia.io/t/js-only-components-in-aurelia-2/4438/2 "2021-10-14T13:46:49Z")

</div>

if you look at the decorator for custom elements [Using @customElement decorator - The Aurelia Docs](https://docs.aurelia.io/getting-to-know-aurelia/components/creating-components/using-customelement-decorator) you’ll notice the template prop. in the given sample its imported from an HTML but can be a string instead as well

---

<div class="post-metadata">

**Author:** ![WizardofOz](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/wizardofoz/32/989_2.png) [@WizardofOz](https://discourse.aurelia.io/u/WizardofOz)\
**Post date:** [October 19, 2021, 8:24am UTC](https://discourse.aurelia.io/t/js-only-components-in-aurelia-2/4438/3 "2021-10-19T08:24:14Z")

</div>

Thank you! I had read that page but didn’t realise that `@customElement` can be used with strings.

However, I’m still having problems instantiating the component with the enhance API. My code looks like this:

```auto
// test-component.js
import { customElement } from 'aurelia'

@customElement({
    name: 'test-component',
    template:
    `<div>
        <h1>Test</h1>
    </div>`
})
export class TestComponent {
    
    attached() {
        console.log('attached!')
    }
}

// index.js
import Aurelia from 'aurelia'
import { TestComponent } from './test-component'

const controller = await Aurelia.enhance({
    host: document.getElementById('container'),
    component: TestComponent
})
console.log(controller)

```

The `attached` method on the component is called, and `controller.host` points to the div element on my page, but the DOM element doesn’t get populated with any content.

---

<div class="post-metadata">

**Author:** ![bigopon](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/bigopon/32/18_2.png) [@bigopon](https://discourse.aurelia.io/u/bigopon)\
**Post date:** [October 21, 2021, 1:02pm UTC](https://discourse.aurelia.io/t/js-only-components-in-aurelia-2/4438/4 "2021-10-21T13:02:13Z")

</div>

When enhancing, the template is the component template. This means the `template` specified in the `@customElement` decorator will not be used.