根本原因是lessc默认未显式指定utf-8编码写入，node.js的fs.writefile依赖系统locale（如iso-8859-1），导致中文被错误编码；解决方案是源文件确保utf-8、编译时显式以'utf8'编码写入输出文件。
Less编译后CSS文件里中文变乱码，根本原因不是Less本身不支持中文，而是编译过程默认忽略源文件编码声明，且输出时未显式指定UTF-8写入——只要源文件是UTF-8编码、编译器未强制转码，问题就出在工具链的字符流处理环节。
lessc 命令行编译时中文乱码
直接用 lessc 编译含中文的 .less 文件，生成的 .css 里中文变成 或其他符号，常见于 macOS 或某些 Linux 终端环境。这不是 Less 语法问题，而是 Node.js 的 fs.writeFile 默认使用系统 locale 编码（如 ISO-8859-1）写入文件。
- 确认源文件确实是 UTF-8 编码：用
file -i style.less检查，输出应含charset=utf-8 - 强制
lessc输出 UTF-8：加--no-color并重定向输出，同时用iconv或node脚本确保写入编码
更稳妥做法是用 Node.js 脚本替代裸调lessc：
const less = require('less');
const fs = require('fs').promises;
(async () => {
const content = await fs.readFile('style.less', 'utf8');
const output = await less.render(content, { paths: ['.'] });
// 显式以 utf8 编码写入
await fs.writeFile('style.css', output.css, 'utf8');
})();
避免依赖 shell 环境变量或终端 locale，从源头控制编码。
Webpack + less-loader 中文乱码
Webpack 构建时 CSS 里中文显示为方块或问号，通常是 less-loader 读取文件时未按 UTF-8 解码，或 css-loader 处理 @charset 声明失败。
-
less-loader配置中必须显式设置sourceMap和implementation，但关键点是：它默认使用fs.readFileSync，而该方法在无编码参数时行为取决于 Node 版本和系统；务必加encoding: 'utf8'（虽然文档没强调，但实测有效） - 在
webpack.config.js中这样写：
module: {
rules: [{
test: /\.less$/,
use: [{
loader: 'less-loader',
options: {
implementation: require('less'),
// ⚠️ 这行不能少
lessOptions: { javascriptEnabled: true }
}
}]
}]
}
同时确保 css-loader 版本 ≥ 6.0，旧版对 @charset "UTF-8"; 支持不完整；若仍乱码，在 .less 文件顶部手动加一行：@charset "UTF-8";（注意必须是文件第一行，前面不能有空行或注释）。
VS Code + Easy LESS 插件编译乱码
保存 .less 后自动生成的 .css 中文全变 \uXXXX 或乱码，本质是插件底层调用 lessc 时未传参或读取了错误的 locale。
- 检查 VS Code 设置里的
files.encoding是否为utf8（不是utf8bom，BOM 可能干扰 Less 解析） - 禁用 Easy LESS，改用官方推荐方式：在项目根目录建
lessc.sh脚本，内容为：#!/bin/bashexport NODE_OPTIONS="--experimental-specifier-resolution=node"lessc --source-map --no-color "$1" "${1%.less}.css" - 然后在 VS Code 的
settings.json中配置："easy-less.compileOnSave": false，改用tasks.json调用该脚本
插件封装太深，出问题难调试；绕过插件直跑命令，可控性高得多。
HTML 引入后浏览器仍显示乱码
编译出来的 CSS 文件本身正常（用 cat style.css | hexdump -C 可见中文对应 UTF-8 字节），但在网页中还是乱码，说明问题转移到了 HTML 或 HTTP 层。
- 检查 HTML 文件是否有
<meta charset="utf-8">，且必须放在最前面 - 确认 Web 服务器返回的
Content-Typeheader 包含; charset=utf-8，例如：text/css; charset=utf-8；Nginx 需加charset utf-8;到 location 块 - 如果用了构建工具（如 Vite、Parcel），它们默认注入的
<link>标签可能没设charset属性，但现代浏览器已不依赖该属性；真正要盯的是 MIME type 和 HTML 的 meta
最容易被忽略的是：即使 CSS 文件存为 UTF-8，若服务器返回时 header 里没声明 charset，部分老浏览器（IE11、旧版 Safari）会退回到 ISO-8859-1 解析——这时中文就彻底报废了。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
