API: The css Property

Nuxt.js lets you define the CSS files/modules/libraries you want to set globally (included in every page).

In case you want to use sass make sure that you have installed node-sass and sass-loader packages. If you didn't just

  1. npm install --save-dev node-sass sass-loader
  • Type: Array
    • Items: string

In nuxt.config.js, add the CSS resources:

  1. export default {
  2.   css: [
  3.     // Load a Node.js module directly (here it's a Sass file)
  4.     'bulma',
  5.     // CSS file in the project
  6.     '@/assets/css/main.css',
  7.     // SCSS file in the project
  8.     '@/assets/css/main.scss'
  9.   ]
  10. }

Nuxt.js will automatically guess the file type by its extension and use the appropriate pre-processor loader for webpack. You will still need to install the required loader if you need to use them.