MENU
SASS
Next.js provides built-in support for Sass once the necessary package is installed. It works with both .scss and .sass file extensions. For component-scoped styles, you can use CSS Modules with .module.scss or .module.sass files.
If you're unsure which to use, start with .scss since it closely follows regular CSS and doesn't require learning the indented format.
To install SASS:
npm i sass
You can configure SASS in next.config.ts:
import type { NextConfig } from 'next'
const nextConfig: NextConfig = {
sassOptions: {
additionalData: `$var: red;`,
implementation: 'sass-embedded',
},
}
export default nextConfig