直接 import './base.css' 即可，但需确保其被真正执行（如放在 main.jsx 顶部），全局 CSS 与 CSS Modules 可共存但不可混用，CDN 引入需注意加载顺序和失效风险，className 拼接时全局类名不可带点号。
直接 import './base.css' 就行，但得确认它真被加载了
React 18 本身不处理 CSS，靠构建工具（Webpack/Vite）注入。只要 import './base.css' 出现在任意被引用的 JS 模块里（比如 main.jsx 或某个组件），样式就会生效——但很多人漏掉“被真正执行”这一步。
- ✅ 正确位置：通常写在
src/main.jsx顶部，紧挨着 React 导入之后 - ❌ 错误写法：只写在某个未被渲染的组件里（比如一个从没被 import 的
Utils.module.css文件里写了import './base.css'），它根本不会运行 - ⚠️ 注意：如果用了 Vite，确保
css插件启用；Webpack 则需style-loader+css-loader在 rules 中配置
全局 CSS 和 CSS Modules 能共存，但别混在同一个文件里
import './base.css' 和 import styles from './Button.module.css' 完全不冲突，它们走的是两套机制：前者注入全局作用域，后者生成哈希类名并导出对象。真正容易出错的是把二者塞进同一个 CSS 文件。
- ❌ 禁止在
.module.css文件里写@import '../base.css'—— 构建工具通常不支持，且破坏模块边界 - ✅ 推荐做法：全局重置、CSS 变量、工具类（如
.sr-only）全放src/index.css，再统一import './index.css'到入口 - ⚠️ 特别注意：Ant Design 或 Bootstrap 这类库的 CSS 必须走全局引入（
import 'antd/dist/reset.css'），不能用模块化方式导入，否则类名失效
CDN 引入全局 CSS 更轻量，但得手动管理加载顺序
如果只是用 Tailwind、Animate.css 这类纯样式库，CDN 是最省事的选择，绕过打包和 loader 配置。
Orderly Sdk React Hooks
下载
Orderly React SDK 钩子使用参考指南，包括 useOrderEntry、usePositionStream、useOrderbookStream、useCollateral 等。
- ✅ 正确姿势：在
public/index.html的<head>里加<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/animate.css@4.1.0/animate.min.css"> - ⚠️ 风险点：CDN 失效或加载慢会导致样式闪白；多个 CDN 之间无加载依赖控制，比如
tailwind.css必须在自定义base.css之前加载，否则变量覆盖失败 - ? 提示：若要用
:root变量配合 JS 主题切换，必须确保 CSS 变量定义在全局 CSS 里，且早于任何 JS 执行（所以index.html <head>是最稳妥位置）
className 拼接时别把全局类名写成 .xxx
混合使用全局类（如 animate bounce）和模块类（styles.container）时，字符串拼接必须干净——全局类名就是纯字符串，不能带点、引号或冒号。
立即学习“前端免费学习笔记（深入）”；
- ✅ 正确：
className={`${styles.container} animate bounce`} - ❌ 错误：
className={`${styles.container} .animate .bounce`}（浏览器收到的是class="xxx .animate .bounce"，点号变成字面量） - ? 更健壮写法：
import clsx from 'clsx'; className={clsx(styles.container, 'animate', 'bounce')}，自动跳过 falsy 值，避免undefined污染 class 字符串
:root 变量必须全局，而按钮边距、卡片阴影这种业务相关样式，哪怕只用一次，也建议放进 .module.css。 
