0

совсем недавно решил познакомиться с Vue.js и соответственно с созданием одно-страничного приложения. В связи с этим возник ряд вопросов, так раньше работал только с MPA с использованием jQuery и там я четко себе представлял структуру, ну к примеру файл страницы html, к нему отдельный файл со скриптами и отдельный со стилями, ну и общие файлы со скриптами и со стилями. Ну а теперь собственно о вопросах которые у меня возникли:

  • Как структурировано SPa приложение? На сколько я видел, что в файл с компонентом помещается html разметка, стили и скрипты этого компонента... Но к примеру у меня выходит по 100-150 строк кода CSS, HTML, Vue.js это не слишком ли большое нагромождение? И что касается общих стилей они же должны выноситься в отдельный разделяемый файл?
  • При использование vue-router стили отделены от каждого компонента или пересекаются друг с другом? К примеру если у меня и в одном и другом компоненте есть класс text и в одном компоненте у него цвет красный а в другом черный, данный свойства пересекутся или нет?
  • Есть у меня имеются небольшие компоненты к примеры всплывающие окна авторизация, стоит ли их выносить в отдельный компонент, либо стоит совмещать с другими где они используются?
  • К примеру у менять есть четыре страницы у первых двух одинаковый футер и шапка и в других двух тоже одниковый, также в первой странице присутствуеет всплывающая форма авторизации, на сколько компонентом это все примерно нужно разбить?
  • Хотелось бы получить внятный ответ по поводу структуры SPA приложение желательно с использованием Vue, конечно же с затрагиванием моих вопросов. За ранее спасибо...

    2
    • 1
      если вам понравился мой ответ, то поставьте пожалуйста зеленую галочку
      – Yernar
      28 апр 2018 в 11:54
    • Конечно, информация полезная для меня, но вопрос не был раскрыт в полной мере... Поэтому просто голос за.
      – QuickDzen
      28 апр 2018 в 12:14

    1 ответ 1

    5
    • Вы можете разделить компоненты на компоненты. Это сократит ваш код.
    • Если вы в каком-то компоненте в тэг style добавите атрибут scoped, то стили будут действовать только на тот компонент. А без scoped эти стили будут общими для всех компонентов.
    • Вам следует создавать отдельный компонент тогда, когда вам нужно использовать его несколько раз. Это сократит ваш код.

    P.S. Ответы на все эти вопросы вы можете найти в документации официального сайта Vue.js

    Ваш ответ

    Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими пользовательским соглашением, политикой конфиденциальности и политикой о куки

    Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.