Configuration

By default, Nuxt.js is configured to cover most use cases. This default configuration can be overwritten with the nuxt.config.js file.

build

This option lets you configure various settings for the build step, including loaders, filenames, the webpack config and transpilation.

Documentation about build integration

css

This option lets you define the CSS files, modules, and libraries you want to include globally (on every page).

Documentation about css integration

dev

This option lets you define the development or production mode of Nuxt.js (important when you use Nuxt.js programatically)

Documentation about dev integration

env

This option lets you define environment variables that are available to both client and server.

Documentation about env integration

generate

This option lets you set up parameter values for every dynamic route in your application that will be transformed into HTML files by Nuxt.js.

Documentation about generate integration

head

This option lets you define all default meta tags for your application.

Documentation about head integration

loading

This option lets you customize the loading component that Nuxt.js uses by default.

Documentation about loading integration

modules

With this option you can add Nuxt.js modules to your project.

Documentation about modules integration

modulesDir

This option lets you define the node_modules folder of your Nuxt.js Application.

Documentation about modulesDir integration

plugins

This option lets you define JavaScript plugins that should be run before instantiating the root Vue.js application.

Documentation about plugins integration

rootDir

This option lets you define the workspace of your Nuxt.js application.

Documentation about rootDir integration

router

With the router option you overwrite the default Nuxt.js configuration of Vue Router.

Documentation about router integration

server

This option lets you configure the connection variables for the server instance of your Nuxt.js application.

Documentation about server integration

srcDir

This option lets you define the source directory of your Nuxt.js application.

Documentation about srcDir integration

dir

This option lets you define the custom directories of your Nuxt.js application.

Documentation about dir integration

transition

This option lets you define the default properties of the page transitions.

Documentation about transition integration

Asynchronous Configuration

If you need to populate some options (e.g. the head) with asynchronous data (e.g. coming from an API), you have the possibility to return a promise. Here is an example:

  1. /*
  2. axios-module cannot be used in nuxt.config.js
  3. You need to import axios and configure it again
  4. */
  5. import axios from 'axios'
  6. export default async () => {
  7. const data = await axios.get('endpoint')
  8. return {
  9. head: {
  10. title: data.head.title
  11. //... rest of config
  12. }
  13. }
  14. }