Less编译崩溃报JavaScript heap out of memory主因是AST节点爆炸，非物理内存不足；须升级Less至3.13.1+/4.2.0+、改递归Mixin为.loop()尾调用、禁用通配@import、压平嵌套选择器、拆解环状@import链并启用(once)/(reference)/(inline)。
Less编译直接崩溃报FATAL ERROR: JavaScript heap out of memory
这不是你机器内存小，而是Less解析器在构建AST时节点爆炸——比如嵌套超20层、递归.mixin()没终止条件、或@import "components/*.less"反复加载同一文件。调--max-old-space-size只是拖延，必须改代码结构。
- 运行
npx lessc --version，若版本≤3.9.0，立刻升级到less@^3.13.1或less@^4.2.0，新版AST回收优化能降内存40%+ - 把所有递归写法
.gen(@n) when (@n > 0) { .gen((@n - 1)); }重写为.loop()尾调用模式，Less 4.0+才识别这种优化 - 禁用通配
@import "components/*.less"，改用明确路径+@import (once)；环状依赖（A→B→C→A）会直接卡死，用postcss-import暴露链路再拆解 - 深层嵌套如
.a { .b { .c { .d { ... } } }，超过15层就该压平，每层新增独立AST节点，20层≈百万级节点
编译中断报ParseError: Unrecognised input
绝大多数不是编码问题，而是Less词法分析器把中文路径、零宽空格或注释黏连当成了非法token。它根本不尝试解码，遇到汉字就停。
- 路径含中文（如
@import "../组件/按钮.less"）？必须通过构建工具绕过Less原生解析：Webpack配less-loader的paths，Vite配preprocessorOptions.less.paths，命令行用--include-path=src，然后所有@import改写成纯ASCII路径 - 复制网页/Word代码进来？VS Code开启“显示不可见字符”，揪出U+200B零宽空格、U+00AD软连字符、UTF-8 BOM——这些看不见的字符会让
@primary-color: #333;/*注释*/直接报错 -
@import行末加/* 工具类 */注释？旧版Less（如3.13.x）会把;和/*黏在一起，当成不完整声明，注释必须独占一行且前后空行
样式生成了但内容不对或完全丢失
这类问题最隐蔽：不报错，但CSS没按预期输出，根源常在调用点而非定义点。
- 写
.flex-center没括号？Less把它当选择器处理，整块规则静默丢弃；所有mixin调用必须带()，哪怕无参也要写.flex-center() - 嵌套里漏括号高发：
&:hover { .transition(); .color-change; }第二处没()，后续样式全失效 -
/deep/或::v-deep直接写进Less？Less不认识，整个文件编译失败；要用变量转义：@deep: ~">>>"; @{deep} .cube-btn { background: red; } - 四层以上嵌套（如
.layout .sidebar .content .item）导致权重爆表，低权样式根本覆盖不了——别靠嵌套“看起来整洁”，优先用BEM命名扁平化
Source Map跳不到.less源文件
不是DevTools坏了，是映射链断在了某一处：要么sourceMappingURL注释根本没生成，要么.map文件路径不可访问，要么sources里写的路径服务器根本收不到请求。
立即学习“前端免费学习笔记（深入）”；
- Less 4.0+默认关闭Source Map，命令行必须显式加
--source-map=styles.css.map；Webpack中less-loader和css-loader的sourceMap: true要同时开，缺一不可 -
.map文件里sources字段写的是["../src/variables.less"]？部署后这个相对路径肯定404，用--source-map-rootpath=/static/改成绝对路径，并确认Nginx或开发服务器能响应/static/src/variables.less - 上线前务必
curl https://yoursite.com/styles.css.map看JSON是否合法，再对每个sources路径curl -I验证返回200——很多问题卡在部署结构和路径配置不匹配 - Vue CLI项目还需在
vue.config.js中设css.loaderOptions.less.javascriptEnabled = true，否则@import解析失败会导致Source Map断链
真正卡住人的，往往不是语法多难，而是错误发生在调用点而非定义点——.mixin()少个括号、@import后多行注释、嵌套里&放错位置……这些地方不报红，却让样式静默消失。
