全局 CSS 必须在对应路由系统的根布局文件顶层静态导入：Pages Router 需在 pages/_app.js 首行导入，App Router 需在 app/layout.tsx 首行导入，且不可动态、嵌套或重复，否则报错或失效。
全局 CSS 必须在路由系统对应的根布局文件顶层静态导入，不能动态、不能嵌套、不能重复——错一个位置就报 Global CSS cannot be imported from files other than your Custom _app.js 或构建静默失效。
确认你用的是 Pages Router 还是 App Router
这是所有操作的前提，搞错就全错：
- 项目里有
pages/_app.js（或_app.tsx），且没有启用app/目录 → 用 Pages Router - 项目里有
app/layout.tsx（或.js），且next.config.js没禁用 App Router → 用 App Router - 两者共存（
pages/和app/都存在）→ 全局样式需分别处理：Pages 页面走pages/_app.js，App 页面走app/layout.tsx
Pages Router：必须在 pages/_app.js 顶部导入
这个文件是 Pages Router 的唯一入口，Next.js 只认它来收集全局样式：
-
import '../styles/globals.css'必须是文件第一行，前面不能有任何代码、注释甚至空行 - 不能写在
MyApp函数内部、useEffect里，也不能用import('./styles/globals.css')动态加载 - 确保
globals.css是纯 CSS 文件：不含:global、不叫globals.module.css、没被next.config.js配置成模块（比如cssModules: { auto: true }） - 如果用了 Tailwind，
@tailwind base、@tailwind components、@tailwind utilities必须都在这个文件里，不能拆开
App Router：只在 app/layout.tsx 顶层导入
_app.js 在 App Router 下完全无效，强行保留还会干扰构建：
dmap-jsapi-skill
下载
DMap GL地图JSAPI（dmapgl）开发指南。用于编写、审查、调试 DMap 地图 API 代码，涵盖地图初始化、覆盖物渲染、图层管理、事件处理、控件交互等任务。当用户提及 dmap、dmapgl、jsapi‑gl 或相关地图开发需求时自动触发。
立即学习“前端免费学习笔记（深入）”；
- 路径推荐用
app/globals.css，然后在app/layout.tsx第一行写import './globals.css' - 不能加
'use client'—— CSS 导入是服务端行为，加了反而可能阻断 SSR 样式注入 - 该导入只影响
app/下的路由，对pages/下的页面毫无作用 - 如果混用双路由，
pages/index.js不会自动继承app/globals.css，得另配pages/_app.js
常见报错和绕不开的坑
这些错误几乎都源于路径、时机或配置错位：
-
Global CSS cannot be imported from files other than your Custom _app.js：大概率你用的是 App Router，却还在pages/_app.js里写导入 - 样式生效但刷新后丢失：CSS 文件里用了
@layer或其他 PostCSS 特性，但没配postcss.config.js - 页面空白或布局错乱：全局 CSS 里写了
body { display: none }类似的重置规则，没意识到它会影响所有路由 - 热更新不生效：修改
globals.css后没重启 dev server，Next.js 对顶层 CSS 导入的 HMR 支持有限
真正麻烦的不是“怎么写”，而是“在哪写”和“为什么这里不行”——尤其当项目从 Pages Router 迁移到 App Router 时，_app.js 里的导入会立刻变成死代码，但错误提示未必直接告诉你这点。
