关于 LESS 在线编译器
在线 LESS 编译器:在浏览器内将 LESS 源代码实时编译为 CSS。LESS 引擎按需从 CDN 加载,不会增加站点本身的体积,所有源码与编译结果都仅保存在你本机。
使用步骤
- 在左侧编辑区输入或粘贴 LESS 源码(支持变量、嵌套、Mixin、运算等完整 LESS 语法)。
- 默认开启「自动编译」,停止输入约 400ms 后会自动重新编译;也可点击「立即编译」按钮手动触发。
- 在右侧查看编译后的 CSS 输出,可一键复制或下载为 .css 文件。
- 可在工具栏切换「压缩输出」「严格单位」「严格数学」等编译选项。
- 点击「示例」可载入一段含变量、嵌套、Mixin 的 LESS 代码,便于快速体验。
常见使用场景
- 临时调试 LESS 片段,无需本地配置 Node / Webpack
- 把同事发来的 LESS 文件快速编译为 CSS 查看
- 配合主题定制工作,预览 LESS 变量改动后的最终样式
常见问题
Q:我的代码会上传到服务器吗?
A:不会。LESS 引擎从公共 CDN 加载到浏览器后,所有编译都在你的本地完成,不会把源码发送到任何后端。
Q:为什么首次打开会有几百毫秒的「加载中」?
A:工具采用按需加载策略:只有当你打开本工具时才会去 CDN 拉取 less.min.js(约 100KB+),从而避免给整个工具站增加额外依赖。加载完成后会缓存在浏览器中,再次访问会很快。
Q:支持哪些 LESS 特性?
A:基于官方 less@4.x 浏览器版构建,支持变量、嵌套、Mixin、函数、@import(仅支持本地源码内联,不会发起跨域请求)等完整语法。
Q:编译失败怎么办?
A:右侧会显示 LESS 引擎返回的错误信息,包括出错的行号与列号,按提示修改源码即可。