Команды

Nuxt.js поставляется с набором полезных команд как для разрабатываемого, так и для финального продукта.

Список команд

Команда Описание
nuxt Запустить сервер разработки localhost:3000 с горячей заменой модулей (hot-reloading).
nuxt build Собрать приложение webpack'ом и минифицировать JS & CSS (для продакшн-версии).
nuxt start Запустить сервер в продакшн-режиме (сперва необходимо запустить nuxt build).
nuxt generate Собрать приложение и сгенерировать каждый маршрут в виде HTML файла (используется в случае статического хостинга).

Вы должны добавить эти команды в файл package.json:

"scripts": {
  "dev": "nuxt",
  "build": "nuxt build",
  "start": "nuxt start",
  "generate" "nuxt generate"
}

Затем вы можете запускать команды с помощью npm run <command> (например: npm run dev).

Продуктовая выкладка

Вероятно, вы захотите избежать запуска Nuxt при развёртывании на сервере. Для этого команды сборки и запуска приложения выполняются раздельно друг от друга:

nuxt build
nuxt start

Например, чтобы развернуть на now.sh, рекомендуется следующий вид package.json:

{
  "name": "my-app",
  "dependencies": {
    "nuxt": "latest"
  },
  "scripts": {
    "dev": "nuxt",
    "build": "nuxt build",
    "start": "nuxt start"
  }
}

Затем запустите now и наслаждайтесь!

Заметка: рекомендуем добавить .nuxt в .npmignore или .gitignore.

Развёртывание на статическом хостинге

Nuxt.js даёт вам возможность хостить веб-приложение на любом статическом хостинге. Например, surge.sh.

Чтобы развернуть на сервисе surge.sh, сперва нужно установить его:

npm install -g surge

Затем мы говорим nuxt.js сгенерировать веб-приложение:

npm run generate

Будет создана папка dist со всем необходимым и готовым к выкладке на статический хостинг.

Теперь мы можем выложить приложение на surge.sh:

surge dist/

Вуаля :)

Если у вас есть проект с динамическими маршрутами, взгляните на генерацию конфигурации, чтобы указать Nuxt.js, как генерировать эти динамические маршруты.

В случае генерации веб-приложения через nuxt generate, контекст, определённый для data() и fetch(), не будет содержать req и res.

Обнаружили ошибку или хотите внести свой вклад в документацию? Отредактировать эту страницу на GitHub!