Дата публикации
25 Августа 2020
Дата изменения
25 Августа 2020
Уникальных просмотров
4.393

Оглавление

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

Настройки по умолчанию

Ниже приведен список настроек, которые прописаны в файле nuxt.config.js по умолчанию.

mode

Опция mode — указывает на тип вашего приложения.

target

Параметры деплоя для Nuxt.js версии >= v2.13

head

Nuxt.js позволяет вам определять мета-теги для вашего приложения внутри файла nuxt.config.js, для этого используется опция head. Вы также можете использовать head как функцию в своих компонентах для доступа к данным компонента через this.

Пример опции head:

export default {
  head: {
    title: process.env.npm_package_name || '',
    meta: [
      { charset: 'utf-8' },
      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
      { hid: 'description', name: 'description', content: process.env.npm_package_description || '' }
    ],
    link: [
      { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
    ]
  }
}

Список возможных параметров для размещения в опции head, можно найти в vue-meta documentation.

css

Опция в которой вы можете регистрировать глобальные (подключенные к каждой странице) CSS / SCSS файлы приложения.

plugins

Опция plugins позволяет писать JavaScript плагины, которые вы можете запустить перед созданием экземпляра корневого приложения vue.js. Один из самых популярных плагинов для vue/nuxt — является axios (позволяет отправлять HTTP запросы как со стороны сервера, так и со стороны клиента). Подробная инструкция по подключению axios описана в официальной документации Nuxt.js.

components

Если значение true или тип задан как объект, тогда приложение будет включать в себя зависимости nuxt/components и автоматически импортировать ваши компоненты (определенные в ~/components), когда вы используете их в своих шаблонах.

modules

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

build

Опция позволяет кастомизировать встроенные в Nuxt.js webpack.

Все настройки

Другие настройки файла nuxt.config.js.

loading

Опция позволяет настроить компонент индикатора загрузки, который используется по-умолчанию в Nuxt.js при переходе между маршрутами.

Подробнее см. официальную документацию.

router

Опция позволяет переписать конфигурацию vue-маршрутизатора, поставляемую по-умолчанию в Nuxt.js.

Подробнее см. официальную документацию.

env

Опция позволяет создавать переменные для клиентской и серверной сторон.

Подробнее см. официальную документацию.

generate

Опция позволяет определить значения параметров для всех динамических маршрутов в вашем приложении, которые Nuxt.js трансформирует в HTML-файлы. Проще говоря — создает из вашего сайта с SSR, статический сайт.

Подробнее см. официальную документацию.

Полный список возможных базовых конфигураций доступен на сайте официальной документации фреймворка, в разделе Configuration.

Благодарность автору

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

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

Время работы: 0,1207 s
Время запросов: 0,1207 s
Количество запросов: 27
Источник: cache