Moe Green

Если я правильно понял Вашу "проблему", то она решается очень просто.

Достаточно в блоке со стилями установить атрибут scoped - https://vue-loader.vuejs.org/guide/scoped-css.html.

Тем самым Вы ограничите область видимости для стилей данного компонента только этим компонентом. И при сборке не будет проблем с приоритетами стилей.

Вот здесь - сравнение способов стилизации компонента в React.js и Vue.js (раздел Component-Scoped CSS) - https://vuejs.org/v2/guide/comparison.html.

Сдается мне - в Вашем случае - верстальщик и frontend developer - Вы и есть, в одном лице. ))

Свое видение Вашей "проблемы".

1. Подключаете на странице дистрибутив Vue через CDN или локально.
2. Переносите тот кусок кода страницы, который нужно подвести под контроль Vue, в отдельный js-файл.
3. Вместо этого куска кода на странице помещаете элемент с идентификатором (id) - при рендеринге здесь поместится в результате Ваш Vue-компонент.
4. Модифицируете перенесенный код в js-файле под Vue - создаете Vue-компонент.
5. Подключаете js-файл на странице.
6. Профит.

P.S.
Таким образом можно делать Vue-компонентов - сколько угодно.

Все верно.
В случае с Vue можно сказать - есть "классический" вариант, когда SPA-приложение.
А есть более тесная связка Vue с бэкендом - это Nuxt.js (SSR).
В этом случае можно интегрировать тесную взаимосвязь с backend при помощи Express.js или Koa.js, к примеру. Но для этого нужны хорошие знания бэкенда - Node.js, MongoDB, Mongoose.

axios.get(awesome_url)
    .then(res => {
        const news = Object.keys(res.data).map(el => {
            return {
                ...res.data[el],
                id: el
            }
        })
        this.news = news
    })
    .catch(e => console.log(e))

Как-то так?

`component: () => import('pages/index')` - это называется "ленивая загрузка", верно?
если да - то вот здесь возможна причина тормозов.

а так - лично я не увидел ничего такого особенного в коде. да и методы - они маленькие и простые - чего там может быть тормознутого.

Мне также кажется, что лучшим вариантом будет Vue+Laravel. И хоть я сам Laravel пока не владею (изучаю Nuxt.js), но в будущем планирую изучить этот фреймворк. На фрилансе чуть ли не половина заказов по Vue - это конкретно Vue+Laravel.

"... включить выравнивание по присвоению" - в Sublime видел такой плагин. Возможно, и под VSC есть подобный?

Круто, че. Я такой примерный стек только осваиваю.
От себя могу сказать, что Nuxt не пользовался, но есть общее мнение, что он сыроват на сегодня.

Имхо, у Вас какая-то путаница - данные выводятся в <input>. Но там же можно искать и уже существующие items?

что-то похожее - https://forum-archive.vuejs.org/topic/165/conditio...

Насколько я знаю, работать с Vue в Sublime не слишком удобно до сих пор.
Как варинт - можно посмотреть в сторону Visual Studio Code - этот редактор "из коробки" имеет полную поддержку Vue.

наверное, здесь можно найти что-то похожее?
https://medium.com/devschacht/%D0%BF%D1%8F%D1%82%D...

у Vue.js их четыре, таких шаблона. Попробуйте webpack-simple или точно такой же, но на Browserify.

Лично у меня сложностей со структурой шаблоны не вызывают. Но у меня есть другая сложность, которая затрудняет работу с такими шаблонами - недостаточное знание синтаксиса ES6.