Структура Nuxt.js приложения

Просмотров 808
Сложность:

Один из ответа на вопрос "Почему Nuxt, а не чистый Vue?" - типовая структура Nuxt.js приложения. Фреймворк предлагает своё готовое решение по разбитию приложения на папки и файлы. Главный плюс типизации расположения файлов проекта и разделения функциональности - более простой вход в чужие проекты.

Не каждая из нижеперечисленных папок является обязательной. Например, если вы не используете Vuex, то папка Store вам просто не нужна.

  • Assets - файлы, которым потребуется дальнейшая компиляция. Например, это может быть scss файл, который при сборке будет преобразован в css.
  • Components - классические Vue компоненты.
  • Layouts - шаблоны. Например, шаблон страницы с ошибкой или шаблон административного раздела сайта.
  • Middleware - скрипты, которые могут быть запущены перед рендером определенных страниц или шаблонов.
  • Pages - страницы сайта: статические и динамические. Страница - это аналог Vue компонента.
  • Plugins - скрипты, которые мы можем встроить (inject) в наше приложение. А также место для подключения классических Vue плагинов.
  • Server - папка с бэкендом. Сугубо опциональная.
  • Static - статические файлы, которые доступны по пути "/". То есть это оптимальное место для favicon и robots.txt.
  • Store - менеджер глобальных состояний Vuex.
  • nuxt.config.js - основной файл с настройками Nuxt.js приложения.

Также в проекте могут быть несколько папок, в которых хранятся сгенерированные приложения (.nuxt и dist), а также хранилище всех зависимостей (node_modules).

Видеоверсия

Автор: Александр Дергунов
Дата публикации: 21.3.2021 г.
Поделиться:

Простое Nuxt.js приложение

Оптимизация Nuxt.js приложения
4662 просмотров4662
Простое Nuxt.js приложение
Пользуемся преимуществами современных javascript фреймворков.
Сложность:
Что такое Nuxt.js?
663 просмотров663
Простое Nuxt.js приложение
Описание javascript фреймворка Nuxt.js.
Сложность:
Установка Nuxt.js и подготовка IDE
722 просмотров722
Простое Nuxt.js приложение
Устанавливаем нужное ПО и плагины, загружаем проект с Github.
Сложность:
Режимы работы Nuxt.js
735 просмотров735
Простое Nuxt.js приложение
Отдельный процесс и middleware для Express.js.
Сложность:
Структура Nuxt.js приложения
809 просмотров809
Простое Nuxt.js приложение
Типовые папки и файлы, разделение функциональности.
Сложность:
Структура Nuxt.js приложения - видео
Бэкенд Express + Mongoose
723 просмотров723
Простое Nuxt.js приложение
Реализация бэкенда для Nuxt приложения
Сложность:
Шаблоны и страницы
422 просмотров422
Простое Nuxt.js приложение
Для чего они нужны? Какие между ними отличия.
Сложность:
Vue компоненты
931 просмотров931
Простое Nuxt.js приложение
Примеры использования в Nuxt.js
Сложность:
Главная страница энциклопедии
metrika