不生效，因 less-loader 输出无模块语义，css-loader 的 modules 仅作用于 CSS/PostCSS；CSS Modules 未触发，composes 被 Less 解析器报错。
lang="less" 和 module 不能共存——Vue 的 写法看似合理，实际会直接失效。Less 解析器不认识 composes，CSS Modules 的哈希类名机制也根本没被触发。
为什么
Vue 的构建链路中，css-loader?modules 只对纯 CSS 或 PostCSS 输入起作用；而 less-loader 输出的是普通 CSS 字符串，不带模块化语义。即使你写了 module，less-loader 仍按全局模式编译，.header { color: red } 最终就是 .header { color: red }，没加任何哈希前缀。
- 检查浏览器开发者工具的元素样式面板：如果看到原始类名（如
.button）而非类似Button_button__abc123的哈希名，说明 CSS Modules 完全没介入 - Webpack 构建日志里搜
css-loader配置，确认modules: true是否只作用于.css或.module.css规则，而非.less - 报错信息如
ParseError: Unexpected token 'composes'就是典型信号：Less 编译器把composes当成了非法语法
用 :deep() 覆盖第三方组件样式的正确写法
Vue 3 中 /deep/ 和 ::v-deep 已废弃，必须用 :deep()，且它不能单独出现，必须挂载在 scoped 选择器下。
- 错误写法：
—— 没有外层选择器，编译后会被忽略 - 正确写法：
——:deep()只能包裹简单选择器（不能含空格、逗号或嵌套） - 如果要穿透多层，比如改
van-button里的span，得写成.my-form :deep(.van-button) span，不能写:deep(.van-button span) - Less 里用
:deep()要注意括号匹配：嵌套中写&:deep(.icon)是合法的，但:deep(.icon:hover)会失败，伪类不支持
Less 文件如何实现事实上的“模块化”
放弃让 Less 自己做模块化，转而靠人工命名空间 + 构建时前缀注入，这是当前最稳的路径。
- 每个组件 Less 文件最外层必须套唯一根类，例如
.UserProfile { .avatar { width: 40px; } }，禁止出现无父级的.avatar - 配合
postcss-prefixwrap插件，在 Webpack 或 Vite 的 PostCSS 配置中启用：prefixwrap('[data-comp="user-profile"]')，输出自动变成[data-comp="user-profile"] .avatar - 避免在 Less 里
@import全局 UI 库文件（如~antd/lib/style/themes/default.less），变量和 mixin 会污染全局；改用@import '~antd/lib/style/themes/default.less' (reference)加(reference)参数，只引入定义不输出 CSS - 组件内调用 Ant Design 的
.ant-btn类时，必须显式写.UserProfile :deep(.ant-btn)，否则 scoped 阻断穿透
切换到 .module.less 的现实成本
目前没有官方 loader 支持 .module.less，强行配 css-loader?modules + less-loader 会导致变量无法跨文件解析、@import 路径错乱、mixin 丢失等问题。
- 真正可行的替代方案只有两个：
.module.css或.module.scss，它们原生支持 CSS Modules 且生态稳定 - 如果项目重度依赖 Less 的 mixin 和变量，建议保留
.less作为纯逻辑层（只放@mixin、@variable），再用.module.css引入并调用，通过@import把变量注入进去 - 别指望构建工具自动帮你把
.less“转模块”，所有所谓“支持 module 的 less-loader” 插件，本质都是 hack：要么删掉composes行，要么把 Less 编译结果再喂给 css-loader，中间环节极易出错
真正卡住人的不是技术选型，而是变量和 mixin 在全局与模块之间怎么流转——一旦开始混用，@primary-color 在一个文件里被重定义，整个 UI 的按钮颜色就可能突然变紫。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
