The plugins property

Use vue.js plugins with the plugins option of Nuxt.


Note: Since Nuxt 2.4, mode has been introduced as option of plugins to specify plugin type, possible value are: client or server. ssr: false will be adapted to mode: 'client' and deprecated in next major release.

  • Type: Array
    • Items: String or Object

If the item is an object, the properties are:

  • src: String (path of the file)
  • mode: String (can be client or server) If defined, the file will be included only on the respective (client or server) side.

Note: Old version

  • Type: Array
    • Items: String or Object

If the item is an object, the properties are:

  • src: String (path of the file)
  • ssr: Boolean (default to true) If false, the file will be included only on the client-side.

The plugins property lets you add Vue.js plugins easily to your main application.

nuxt.config.js

  1. export default {
  2. plugins: [
  3. { src: '~/plugins/both-sides.js' },
  4. { src: '~/plugins/client-only.js', mode: 'client' },
  5. { src: '~/plugins/server-only.js', mode: 'server' }
  6. ]
  7. }

nuxt.config.js

  1. export default {
  2. plugins: ['@/plugins/ant-design-vue']
  3. }

plugins/ant-design-vue.js

  1. import Vue from 'vue'
  2. import Antd from 'ant-design-vue'
  3. import 'ant-design-vue/dist/antd.css' // Per Ant Design's docs
  4. Vue.use(Antd)

Note that the css was imported as per Ant Design Documentation

All the paths defined in the plugins property will be imported before initializing the main application.