next.js 15 中 import './xxx.css' 报错的主因是违反样式导入规则：全局 css 只能于 app/globals.css 中引入并由 layout.tsx 导入；非模块化 css 禁止在任意组件（尤其 server component）中直接 import；css modules 虽可解析，但需组件标记 "use client" 才能生效。
Next.js 15 中 import './xxx.css' 报错的常见原因
报错本身不是 CSS 写错了，而是 Next.js 15 的构建链路对 CSS 导入位置和上下文更严格。最典型的是在服务端组件（Server Component）中直接 import './Button.css' —— 这会立刻触发 ReferenceError: document is not defined 或构建阶段报 Global CSS cannot be imported from files other than your custom _app.tsx。
根本原因是：Next.js 15 默认禁用服务端 CSS 注入，所有非 app/globals.css 的 CSS 必须显式绑定到客户端环境。
- 全局样式只能通过
app/globals.css单点引入（且该文件必须在app/layout.tsx中import） - 组件级样式不能在 Server Component 文件里
import，哪怕它只是个 .css 文件 - CSS Modules（
.module.css）虽支持服务端解析，但实际生效仍需客户端挂载；若组件未标记"use client"，类名生成可能失效或样式不应用
如何安全地在组件中使用 CSS（含 .css 和 .module.css）
关键判断标准：这个组件是否需要交互、状态或 DOM 操作？如果是，它必须是客户端组件。
正确做法：
- 给组件顶部加
"use client"声明（即使没用 useState/useEffect，只要用了 CSS Modules 或需样式注入就必须加） - 把
import './Button.module.css'放在"use client"之后、组件定义之前 - 普通
.css文件（非模块化）禁止在任意组件内import—— 只能收口到app/globals.css或通过next/font等机制间接加载 - 如果非要局部加载非模块 CSS（如第三方 UI 库的 reset.css），用
useEffect动态插入<style></style>标签，而非import
示例（正确）：
"use client";
import styles from './Button.module.css';
export default function Button() {
return <button classname="{styles.primary}">Click</button>;
}
升级后仍报 Global CSS 错误？检查 next.config.js
Next.js 15 默认关闭了旧版 CSS 支持，如果你在 next.config.js 里还留着已废弃的配置，反而会触发冲突。
DMap GL地图JSAPI（dmapgl）开发指南。用于编写、审查、调试 DMap 地图 API 代码，涵盖地图初始化、覆盖物渲染、图层管理、事件处理、控件交互等任务。当用户提及 dmap、dmapgl、jsapi‑gl 或相关地图开发需求时自动触发。
删掉这些内容：
-
experimental.cssImport（已移除，保留会报错） -
webpack: (config) => { ... }中手动添加css-loader或MiniCssExtractPlugin（Next.js 15 内置处理，自定义会破坏 pipeline） -
unstable_postcss相关配置（PostCSS 现由框架自动管理）
干净的 next.config.js 应该几乎为空，或只保留必要项如 images、output 或 headers。
build 时报错 “CSS cannot be imported from within node_modules”
这是 Next.js 15 新增的安全限制：禁止从 node_modules 中的包直接导入 CSS（防止污染全局样式或引发重复注入）。但很多老库（比如 react-datepicker）文档仍写着 import 'react-datepicker/dist/react-datepicker.css'。
解决方案只有两个：
- 改用支持 CSS-in-JS 或主题对象的替代库（如
@mantine/dates） - 手动复制该 CSS 文件到
app/(shared)/styles/下，再通过app/globals.css@import 引入（注意路径要写对，且不能带 query 参数如?inline）
别试图用 require.resolve 或 fs.readFileSync 绕过 —— 这在 App Router 的构建期不可行，且会破坏 SSR。
真正容易被忽略的点是：Next.js 15 不再容忍“就近导入”的惯性思维。CSS 不再是“随用随引”，而是一种明确的资源分层行为——全局、布局级、组件级，每层有唯一合法入口。越早按这个逻辑组织样式，越少掉坑。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
