Вы можете настроить @nuxt/content через свойство content в вашем nuxt.config.js.

nuxt.config.js
export default {  content: {    // Мои настройки  }}

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

Слияние со значениями по умолчанию

Вы можете задать каждый параметр как функцию или статическое значение (примитивы, объекты, массивы и т.д.) Если вы используете функцию, то стандартное значение будет передано как первый аргумент.

Если вы не используете функцию для определения ваших параметров, модуль попытается объединить их со стандартными значениями. Это может быть удобно для markdown.remarkPlugins, markdown.rehypePlugins и так далее, потому что значения по умолчанию довольно правильные. Если вы не хотите включать значения по умолчанию, просто используйте функцию.

Параметры

apiPrefix

  • Тип: String
  • По умолчанию: '/_content'

Маршрут, использующийся для клиентских API вызовов и SSE(Server-Sent Events — «события, посылаемые сервером»).

nuxt.config.js
content: {  // $content api будет доступен на localhost:3000/content-api  apiPrefix: 'content-api'}

dir

  • Тип: String
  • По умолчанию: 'content'

Директория, используемая для написания контента. Вы можете указать абсолютный или относительный путь, будет обработано Nuxt srcDir.

nuxt.config.js
content: {  dir: 'my-content' // читать контент из my-content/}

fullTextSearchFields

  • Тип: Array
  • По умолчанию: ['title', 'description', 'slug', 'text']

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

text специальный ключ, включающий ваш Markdown перед преобразованием в AST.

nuxt.config.js
content: {  // Искать только по title и description  fullTextSearchFields: ['title', 'description']}

nestedProperties

  • Тип Array
  • По умолчанию: []
  • Версия: v2.0.0

Зарегистрируйте вложенные свойства для обработки обращения через точку и глубокой фильтрации.

nuxt.config.js
content: {  nestedProperties: ['categories.slug']}

liveEdit

  • Тип Boolean
  • По умолчанию: true
  • Версия: >= v1.5.0

Отключает редактирование в реальном времени в режиме разработки:

nuxt.config.js
content: {  liveEdit: false}

markdown

Этот модуль использует remark «под капотом» для компиляции markdown файлов в JSON AST, который будет храниться в переменной body.

Следующий пример работает и для remarkPlugins, и для rehypePlugins::Чтобы настроить, как модуль будет анализировать Markdown, вы можете:
  • Добавить новый плагин к плагинам по умолчанию:
nuxt.config.js
export default {  content: {    markdown: {      remarkPlugins: ['remark-emoji']    }  }}
  • Перезаписать плагины по умолчанию:
nuxt.config.js
export default {  content: {    markdown: {      remarkPlugins: () => ['remark-emoji']    }  }}
  • Использовать локальные плагины
nuxt.config.js
export default {  content: {    markdown: {      remarkPlugins: [        '~/plugins/my-custom-remark-plugin.js'      ]    }  }}
  • Задать параметры в определении плагина
nuxt.config.js
export default {  content: {    markdown: {      remarkPlugins: [        ['remark-emoji', { emoticon: true }]      ]    }  }}
  • Задать параметры используя имя плагина в camelCase
nuxt.config.js
export default {  content: {    markdown: {      // https://github.com/remarkjs/remark-external-links#options      remarkExternalLinks: {        target: '_self',        rel: 'nofollow'      }    }  }}
При добавлении нового плагина обязательно установите его в ваших зависимостях:
Yarn
yarn add remark-emoji
NPM
npm install remark-emoji
nuxt.config.js
export default {  content: {    markdown: {      remarkPlugins: ['remark-emoji']    }  }}

markdown.remarkPlugins

  • Тип: Array
  • По умолчанию: ['remark-squeeze-paragraphs', 'remark-slug', 'remark-autolink-headings', 'remark-external-links', 'remark-footnotes']
  • Версия: >= v1.4.0

Вы можете посмотреть плагины для remark.

markdown.rehypePlugins

  • Тип: Array
  • По умолчанию: ['rehype-minify-whitespace', 'rehype-sort-attribute-values', 'rehype-sort-attributes', 'rehype-raw']
  • Версия: >= v1.4.0

Вы можете посмотреть плагины для rehype.

markdown.basePlugins

Устаревшее. Используйте markdown.remarkPlugins.

markdown.plugins

Устаревшее. Используйте markdown.remarkPlugins.

markdown.prism.theme

  • Тип: String
  • По умолчанию: 'prismjs/themes/prism.css'
Этот модуль добавляет подсветку синтаксиса кода в markdown используя PrismJS.Автоматически ставит тему PrismJS из вашего файла конфигурации Nuxt.js config, поэтому вы можете использовать различные темы, список тем для prism:
Yarn
yarn add prism-themes
NPM
npm install prism-themes
nuxt.config.js
content: {  markdown: {    prism: {      theme: 'prism-themes/themes/prism-material-oceanic.css'    }  }}
Для отключения темы по умолчанию установите prism значение false:
nuxt.config.js
content: {  markdown: {    prism: {      theme: false    }  }}

yaml

  • Тип: Object
  • По умолчанию: {}
Этот модуль использует js-yaml для чтения yaml файлов, вы можете посмотреть список настроек здесь.Обратите внимание, что мы выставляем параметр json: true.

xml

  • Тип: Object
  • По умолчанию: {}
Этот модуль использует xml2js для чтения .xml файлов, вы можете посмотреть список настроек здесь.

csv

  • Тип: Object
  • По умолчанию: {}
Этот модуль использует node-csvtojson для чтения csv файлов, вы можете посмотреть список настроек здесь.

extendParser

  • Тип: Object
  • По умолчанию {}
С этим параметром вы можете задать собственные парсеры для различных типов файлов. Также вы можете перезаписать стандартный парсер!Для добавления собственного парсера вам нужно написать функцию, которая принимает как аргумент контент файла и обратно возвращает обработанные данные.Пример
const parseTxt = file => file.split('\n').map(line => line.trim())
// В конфигурации:
{
  extendParser: {
    '.txt': parseTxt
  }
}

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

nuxt.config.js
export default {  content: {    apiPrefix: '_content',    dir: 'content',    fullTextSearchFields: ['title', 'description', 'slug', 'text'],    nestedProperties: [],    markdown: {      remarkPlugins: [        'remark-squeeze-paragraphs',        'remark-slug',        'remark-autolink-headings',        'remark-external-links',        'remark-footnotes'      ],      rehypePlugins: [        'rehype-minify-whitespace',        'rehype-sort-attribute-values',        'rehype-sort-attributes',        'rehype-raw'      ],      prism: {        theme: 'prismjs/themes/prism.css'      }    },    yaml: {},    csv: {},    xml: {},    extendParser: {}  }}
Table of Contents