一、HBuilderX

1. 语法提示

HBuilderX自带less、scss的完整语法提示和转到定义，无需安装语法提示插件，但不支持stylus的语法提示。HBuilderX的ts语法提示，需要在菜单【工具】-【插件安装】中安装typescript语法提示插件。

2. 编译

• 在菜单工具-插件中安装less、sass、scss、stylus、typescript相关的插件，包括编译插件、格式化插件。
• 安装编译插件后，对less/scss/stylus/ts文件点右键-外部命令，展开的菜单里会有编译菜单。
• 除了编译菜单，插件下还有配置菜单（那个package.json文件），可设置快捷键、编译路径、是否保存时自动编译等。具体见http://ask.dcloud.net.cn/article/19599
• 如果你工程下有webpack等编译器，执行npm运行命令时会走工程下的编译器而不是HBuilderX的插件。
• uni-app项目由uni-app插件在保存时自动编译，无需手动配置。

3. 格式化

格式化less、scss、stylus、typescript等文件需要在插件安装里装prettier插件。然后正常按格式化快捷键ctrl+k即可。

二、老HBuilder

HBuilder支持less、sass。不支持stylus、typescript。

• less、scss代码提示：只能提示其中的css部分，less、sass仅支持对已编写的代码的单词提示
• 编译：对less、sass文件右键点击编译，即可正常编译HBuilder还支持预编译器配置，在菜单工具-预编译器配置里，可以自己选配less、sass甚至coffeescript等文件的预编译器，保存即可触发。Less文件配置说明, 其他文件可参照操作：
• npm全局安装less: npm install less -g
• hbuilder 菜单"工具"->"选项"->"预编译器", 修改.less 中的命令路径和命令参数, 也可以直接使用"智能完成".
• 如果"智能完成"失败, 请在"命令触发地址"中填写less全局安装后的命令文件lessc.cmd (windows) 或 less (mac)文件的路径. 命令参数请参照截图填写,也可自行修改保存路径