必须安装 less（dart less）才能使用 .less 文件，vite 仅调度不自带编译器；配置全局变量需用 modifyvars 而非 additionaldata，且路径不支持 @/ 别名。
装 less 就能用，不装就报 Cannot find module 'less' —— Vite 不自带编译器，只调度。
为什么刚写 .less 文件就报错？
不是路径问题，也不是配置漏了，而是 Vite 启动时尝试 require('less') 失败。常见现象：新建 index.less，执行 vite 立刻崩溃，控制台明确提示 Cannot find module 'less'。
- 必须安装
less（Dart Less），不能用已废弃的less-loader—— Vite 5+ 完全不兼容后者 - 安装命令必须带
-D：npm install -D less、yarn add -D less或pnpm add -D less - 装完无需改
vite.config.js，直接在组件里import './style/index.less'就生效 - 如果项目同时用
.scss和.less，两个包都得装：sass和less缺一不可
css.preprocessorOptions.less 怎么配全局变量？
less 不支持 additionalData 字符串注入，必须用 modifyVars 传顶层变量，比如颜色、字号等基础值。
- 配置示例：
less: { modifyVars: { '@primary-color': '#1890ff' } } - 路径不能用
@/别名——CSS 层不识别别名，modifyVars只接受键值对，不支持@import语句 - 想复用
.mixin()？modifyVars对它无效，得额外加插件（如less-plugin-import） - 多个变量用逗号分隔：
modifyVars: { '@primary-color': '#1890ff', '@border-radius': '4px' }
为什么 @import 在 .less 里失效或变量报 undefined？
less 默认异步解析 @import，且 modifyVars 不递归影响子文件，导致嵌套导入后变量丢失。
- 子文件里的
@import "./vars.less"无法继承父级modifyVars设置的变量 - 若需跨文件共享 mixin，必须在每个用到的地方显式
@import，或借助less-plugin-import插件统一前置加载 - 嵌套深度超 20 层可能触发栈溢出警告，而
scss没这限制 -
vite build不检查未被引用的.less文件——写错语法或路径，只要没被 import 过，就不会报错也不会编译
最容易被忽略的是：Vite 的 css.preprocessorOptions 只对预处理器文件生效，.css 文件完全不走这个流程。别把全局 reset 写进 modifyVars，它不会生效。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
