Nuxt3中css配置必须指定可解析的CSS文件路径，如css: ['element-plus/dist/index.css']，不能仅写包名；使用@element-plus/nuxt模块时无需手动添加CSS路径，否则会冗余冲突。
css配置项只认本地模块或已安装包的路径
直接写 css: ['element-plus'] 会失败——Element Plus 的 npm 包不导出 CSS，它只提供 element-plus/dist/index.css 这类明确路径。Nuxt 的 css 数组本质是 webpack 的 style-loader 入口，必须指向可解析的文件，不能靠“包名猜测”。
- 正确写法：
css: ['element-plus/dist/index.css']（前提是已执行npm install element-plus） - 错误写法：
css: ['element-plus']→ 构建报Cannot resolve module 'element-plus' - 路径大小写敏感：Linux/macOS 下
index.CSS或Index.css都会 404 - 若用的是
@element-plus/nuxt官方模块，它会自动处理样式注入，此时css数组里就不该再重复加 CSS 路径，否则冗余且可能冲突
CDN 或 public 目录下的 CSS 别塞进 css 数组
css 是构建期行为，只处理能被 webpack 加载的资源。把 CDN 地址如 https://unpkg.com/element-plus@2.7.1/dist/index.css 写进 css: []，构建直接报 Module not found。
- CDN 方案：走
app.head.link，例如：{ rel: 'stylesheet', href: 'https://unpkg.com/element-plus@2.7.1/dist/index.css' } - public 目录下的 CSS（如
public/css/ep-theme.css）：路径写成css: ['/css/ep-theme.css']（注意开头是/，对应 public 根目录） - 别同时用
css和head.link引同一份 CSS——HTML 中会出现两条<link>，既浪费又可能因加载顺序导致样式覆盖异常
预处理器入口需要显式声明 loader
有些 UI 库（比如 Bulma 的 SCSS 版本）只提供源码，不带编译后的 CSS。这时 css: ['bulma/sass/bulma.sass'] 会失败，除非项目已安装兼容的 Sass loader。
- Nuxt 3 默认支持
.scss，但对.sass或旧版sass-loader@11+可能不兼容，建议统一用.scss后缀 - 确保已安装：
npm install -D sass sass-loader@10（注意版本，@11以上在 Nuxt 3.10+ 中可能需额外配置） - 更稳妥的做法：改用对象写法，显式指定语言：
{ src: 'bulma/scss/bulma.scss', lang: 'scss' } - 没装 loader 时，错误现象是构建卡住或报
Module parse failed: Unexpected character
样式层叠顺序和全局污染风险
css 数组里项目的顺序 = HTML 中 <link> 插入顺序 = CSS 优先级生效顺序。这点常被忽略，但直接影响你能否覆盖组件库默认样式。
立即学习“前端免费学习笔记（深入）”；
- 想让自定义主题覆盖 Element Plus？把
'@/assets/css/theme.scss'放在'element-plus/dist/index.css'后面 - 两个库都定义了
.btn？仅靠顺序调不了时，就得放弃全局引入，改用<style scoped>或 CSS Modules 局部导入 - 第三方库自带重置（reboot）或基础排版样式，若项目已有 reset.css，注意引入顺序，避免重复重置破坏布局
url(./fonts/icon.woff)），而你用的是 CDN 引入方式，域名不一致就会触发跨域请求失败——这时得手动补 rel="preconnect" 或改用本地托管。 
