Turbopack 原生支持 SCSS，无需 sass-loader 等 Webpack 工具；仅识别 .scss 和 .module.scss 后缀，强制要求 Next.js App Router 结构，不支持自定义 loader、sassOptions 或 PostCSS 插件。
在 Turbopack 中使用 SCSS 不需要额外配置，但必须满足两个硬性前提：项目结构符合 Next.js App Router 规范，且文件后缀为 .module.scss 或 .scss（非全局样式推荐前者）。Turbopack 当前不支持自定义 loader、插件或 sassOptions，强行套用 Webpack 那套配置会直接失效。
为什么 sass-loader 和 node-sass 在 Turbopack 里完全没用
Turbopack 内置了原生 SCSS 解析器，它不走 webpack-style 的 loader 链，也不读取 vue.config.js 或 next.config.js 中的 CSS 相关配置。任何手动安装的 sass-loader、node-sass、dart-sass（除非是全局 CLI）都不会被调用，npm install 这些包只是白占体积。
- Turbopack 只认
.scss和.module.scss后缀，其他如.sass（缩进语法）不支持 - 它自动启用
@use、@forward、嵌套、变量、darken()等标准 Sass 功能，无需开启选项 -
additionalData（如全局注入 variables.scss）在 Turbopack 中无对应机制，强行写进next.config.js会被忽略
.scss vs .module.scss：作用域差异直接影响样式隔离
两者都可被 Turbopack 正确编译，但语义和行为完全不同：
-
.scss文件被视为全局样式，等效于在 HTML<head>中插入<link>，所有类名直接上全局作用域，可能冲突 -
.module.scss启用 CSS Modules，类名自动哈希（如Button_button__abc123），确保组件级样式隔离 - 如果你在
app/layout.tsx中import './globals.scss'，必须用.scss；但在app/page.tsx或组件中，应优先用.module.scss
如何正确引入变量、mixin 和字体等资源
Turbopack 支持标准 SCSS 的 @use 和 @import，但路径解析规则更严格：
立即学习“前端免费学习笔记（深入）”；
- 只接受相对路径（
@use '../styles/vars';）或别名路径（@use 'styles/vars';），前提是该别名已在tsconfig.json的compilerOptions.paths中声明 -
@import已被官方标记为“deprecated”，Turbopack 虽暂未报错，但建议全部迁移到@use+@forward - 字体文件（
.woff2）、图片等静态资源不能直接@use，需通过 JSimport引入，再传给 CSS 变量或 background 属性 - 如果出现
Can't find stylesheet to import，大概率是路径拼写错误，或别名未在tsconfig.json中注册（Turbopack 不读jsconfig.json）
Tailwind + SCSS 混合使用的注意事项
Next.js 13.1+ 官方确认 Turbopack 支持 Tailwind，但混合 SCSS 时有隐性限制：
- Tailwind 的
@layer、@apply可以出现在.scss文件中，但@apply不能用于嵌套选择器内部（会编译失败） - 不要在
.module.scss中@import 'tailwindcss/base'—— 它会破坏 CSS Modules 的作用域，导致全局重置样式泄漏 - 推荐做法：全局重置用
app/globals.scss（含@tailwind base），组件样式用.module.scss+@apply组合工具类 - 若启用
content扫描（如content: ['./app/**/*.{js,ts,jsx,tsx,mdx}']），Turbopack 会自动识别 SCSS 中的@apply并保留对应工具类，无需额外配置
真正容易被忽略的是：Turbopack 的 SCSS 编译发生在内存中，不生成中间 .css 文件，因此无法用 PostCSS 插件（如 autoprefixer）二次处理 —— 它内置了目标浏览器兼容性推导（基于 browserslist），但不暴露控制权。如果你依赖某个 PostCSS 特性（比如 postcss-nested），得确认它是否已被 Turbopack 原生支持（目前仅支持标准 SCSS 嵌套，不支持 PostCSS 版嵌套语法）。
