Стартовый шаблон

Первые шаги

  1. Убедитесь что у вас установлена Node.js
  2. Скачайте подготовленный архив шаблона Nuxt 3
  3. Распакуйте шаблон в любое место вашего ПК, используйте в пути только латинские символы.
  4. Откройте папку шаблона в Visual Studio Code
  5. Создайте терминал и для установки зависимостей запустите команду npm install
  6. По окончанию установки запустите в терминале npm run dev
  7. Проект доступен по адресу http://localhost:3000/, удачных исследований!

Комплектация шаблона

  • NuxtDevTools - дает вам понимание и прозрачность вашего приложения Nuxt
  • NuxtUI - библиотека компонентов от разработчиков
  • Tailwindcss - CSS-фреймворк, ориентированный на утилиты
  • Nuxt Easy Lightbox - модуль для работы с изображениями
  • highlightjs/vue-plugin - плагин подсветки синтаксиса
  • HeroIcons, Material Symbols - подключенные иконки

Начинаем эксперименты

В папке pages создайте файл test.vue со следующим содержимым:

Для очистки шаблона замените содержимое файла default.vue в папке layouts на:

Теперь ваша тестовая страница доступна по адресу http://localhost:3000/test. Вы поняли как устроена верстка и маршрутизация в Nuxt. Продолжайте изучать документации от разработчиков, они найдутся по ссылкам выше.