Vue component. Как передать шаблон?

Question

[Максим Медведев]

Добрый день.
Пытаюсь переписать приложение с vue 2 на vue-next. Проблема в следующем, ранее я мог в шаблоне прописывать шаблоны компонентов, то есть вида

<div id="appAuth">
<router-view></router-view>
<script type="text/x-template" id="my-component">html form</script>
<script type="text/x-template" id="my2-component">html form 2</script>
</div>

и далее

const my = Vue.component('my-component', {
	template: '#my-component',
...

const my2 = Vue.component('my2-component', {
	template: '#my2-component',

с обновлением это уже не работает. вопрос, а как правильно сделать? у меня в зависимости от адреса страницы должен показываться соответствующий блок с формой (все разные).

Comments

[Антон Антон]

а на сборку фронта не перейти, все обязательно с cdn должно грузиться?

[Максим Медведев]

ничего не грузится с cdn, все локально. сборку делаю через gulp
ниже ответил уже, разметка компонентов собирается шаблонизатором twig

Answer 1

[Антон Антон]

Можно попробовать
template: document.getElementById().innerHTML

Comments

[Максим Медведев]

спасибо!
самый очевидный вариант в голову и не пришел.

Answer 2

[Сергей Соколов]

с минимальными изменениями — вставлять сразу строку HTML в свойство template:

const my = Vue.component('my-component', {
  template: `
html
   form
  `,

(обратите внимание, это не одинарные кавычки, а обратные "тики")

Comments

[Максим Медведев]

Это я в документации видел, мне этот вариант не подходит, так как в формах есть вставки селектов содержимое которых собирается шаблонизатором twig

[Сергей Соколов]

Максим Медведев, проблема в фигурных скобках twig vs Vue?

[Максим Медведев]

Сергей Соколов, нет, ошибок никаких в консоли нет.
если менять template: 'test', у компонентов, то все ок. как только указываю ид блока - все, не работает. пробовал в блоке просто текст прописывать - не дает.