@droit174

Как правильно подключать vue js на сайт?

Имеется сайт на django и на клиентской части нужно реализовать блоки со сложной логикой, написанные на vue js.

раньше я подключал вот так:

import prostayaLogika from './components/prostaya_logika'
import slozhnayaLogika from './components/slozhnaya_logika'

if (!!document.getElementById('slozhnaya-logika'))    
    new Vue({
        el: '#slozhnaya-logika',
        render: h => h(slozhnayaLogika)
    });

if (!!document.getElementById('prostaya-logika'))    
    new Vue({
        el: '#prostaya-logika',
        render: h => h(prostayaLogika)
    });

мне кажется этот метод не очень красивый и есть более правильное решение этой задачи.

В админке я ставил vue на всю страницу и передавал в него компоненты
import logikaOne from './components/logika_one'
import logikaTwo from './components/logika_two'
import logikaThree from './components/logika_three'
    
new Vue({
    el: '#app',
    components:{
        logikaOne,
        logikaTwo,
        logikaThree
    },
})

но на сайте не подойдет этот вариант так как придется в шаблон выводить теги вида
<!-- много html кода -->
<logikaOne></logikaOne>
<logikaTwo></logikaTwo>
<logikaThree></logikaThree>
<!-- много html кода -->

и с точки зрения seo этот код будет не валиден а это плохо.

Как это делают на серьезных проектах ?
  • Вопрос задан
  • 248 просмотров
Пригласить эксперта
Ответы на вопрос 1
delphinpro
@delphinpro
frontend developer
мне кажется этот метод не очень красивый

Нормальный метод.

но на сайте не подойдет этот вариант так как придется в шаблон выводить теги вида

Тоже норм. Как вариант, можно использовать атрибут is (правда он тоже не пройдет валидацию w3c)

<div is="logikaOne">
</div>
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы