css 属性

Nuxt 允许配置全局应用（包含在所有页面中）的 CSS 文件/模块/库。

如果想使用 sass，请安装 sass 和 sass-loader 包。如果尚未安装，请按如下方式安装：

yarn add --dev sass sass-loader@10

npm install --save-dev sass sass-loader@10

• 类型: Array
  • 元素: string

export default {
  css: [
    // 直接加载 Node.js 模块（此处为 Sass 文件）
    'bulma',
    // 项目中的 CSS 文件
    '@/assets/css/main.css',
    // 项目中的 SCSS 文件
    '@/assets/css/main.scss'
  ]
}

Nuxt 会自动从扩展名推断文件类型，并使用适当的预处理器 loader。但仍需自行安装所需的 loader。

样式扩展名

可以省略 nuxt.config.js 的 css 数组中文件（CSS/SCSS/Postcss/Less/Stylus/...）的扩展名。

export default {
  css: ['~/assets/css/main', '~/assets/css/animations']
}

默认顺序：['css', 'pcss', 'postcss', 'styl', 'stylus', 'scss', 'sass', 'less']