@import (inline) 会破坏缓存、混淆来源、干扰层叠顺序，因其将css文本原样插入输出文件，不解析语法、不修正路径、无作用域隔离；应优先使用@import (css)实现浏览器独立加载与标准层叠。
@import (inline) 确实能“原样插入”CSS内容，但它不是“纯净引入”，而是把CSS文本直接塞进输出CSS里——这会破坏缓存、混淆来源、干扰层叠顺序。真要“纯净”，该用 @import (css)。
为什么@import (inline)看似方便却容易埋雷
它把目标CSS文件内容逐字复制到当前编译结果中，不解析Less语法，但也不做任何路径修正或作用域隔离。
- 被
@import (inline)插入的CSS规则会出现在当前.less文件所在位置，可能意外覆盖后续定义的同名选择器 - 浏览器无法单独缓存那个CSS文件——只要主.less一变，整个CSS都失效
- source map里查不到样式来自哪个原始CSS文件，调试时只能看到“in main.css”
- 如果被引入的CSS含
@charset或嵌套@import url()，可能触发新解析错误或静默忽略
@import (inline)的正确使用场景很窄
只适合临时调试、极小片段（如一行重置）、或你明确控制了所有副作用的构建流程。
Miller CSV TSV JSON 数据处理器
下载
Miller (mlr) 是一个命令行工具，用于查询、整形和重新格式化名称索引数据，如 CSV、TSV、JSON 和 JSON Lines。它将 awk、sed、cut、join 和 sort 的功能整合到一个专为结构化数据处理而构建的单一工具中。
- 路径必须可读：支持相对路径、绝对路径，但不支持
~别名或@/——@import (inline) "../node_modules/normalize.css"可行，@import (inline) "~normalize.css"会报错 - 不支持变量插值：
@path: "reset.css"; @import (inline) "@{path}";直接失败 - 多个
@import (inline)按顺序拼接，无去重逻辑，重复引入会导致样式重复
替代方案：什么时候该换用@import (css)
如果你只是想让外部CSS“存在”，且由浏览器独立加载、缓存、按标准CSS规则参与层叠，@import (css)才是语义准确、行为可控的选择。
- 它生成的是标准
@import url("...")，路径解析由浏览器完成，和HTML里<link>行为一致 - Webpack中配合
less-loader的paths配置 +~前缀，能可靠映射别名：@import (css) "~@/assets/css/antd.css" - 不会污染主CSS体积，第三方样式更新后，浏览器可单独拉取新版本
- 注意：它不递归处理被引入CSS内部的
@import url()，这部分得靠浏览器或手动拆解
真正难的不是选inline还是css，而是搞清你到底要“合并进去”还是“链接过去”。前者是侵入式集成，后者是松耦合引用——大多数项目需要后者，只是常被inline的即时效果误导。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
