如果您需要对 Visual Studio 2010 的 LESS 支持(在使用它开发 Web 项目时很有用),您可以使用加载项。Stack Overflow中已经讨论了一个候选解决方案。
此扩展带来了 Visual Studio 中已经针对 .css 文件而不是 .less 文件提供的内置语法突出显示和自动完成功能。实际上它只做这个,没有编译或其他不太具体的支持,但仍然是一些东西。
到目前为止,当结合我在问题中提到的其他既定实践时,我发现这足以在 Visual Studio 2010 中进行开发:
目前我正在使用没有 grunt 插件的 Node.js LESS (Lean CSS) 模块来生成 CSS 文件。我有一些 shell 脚本,可以对我手动运行的 CSS 导出进行较少的操作。
对上述内容的另一个转折是,我已经让我的 shell 脚本在项目构建之前执行。这需要对项目进行一些手动设置,这是一个小缺点,但 Visual Studio 项目设置对话框允许您轻松地将这一单行添加到任何项目中。结果是 .less 文件在项目构建(并可能部署)之前作为 css 编译到所需的位置,因此它已设置所有必需的文件。
如果有人感兴趣,这是我的配置:
在 Visual Studio 中 Web 项目的属性中,转到该Build Events
部分并将其放在 Pre-build 文本框中:
$(ProjectDir)App_Less\export.$(ConfigurationName).bat &
这种做法意味着我为自己建立了一些约定:
- Web 项目有一个
App_Less
文件夹(我这样命名,您可以随意更改),其中包含一些 bat 文件。
- 我为每个主题使用一个文件夹,每个这样的文件夹都包含一个
theme.less
引用所有其他较少文件的根文件。示例文件夹结构如下所示:
{ApplicationRoot}
App_Less
Default
// 默认主题
theme.less
export.Debug.bat
exprot.Release.bat
目前,我正在使用 2 个 bat 文件,这取决于我是在本地构建(在 DEBUG 模式下)还是用于生产(在 RELEASE 模式下)。我需要它们驻留在已经提到的文件夹中App_Less
。脚本如下:
导出.Debug.bat:
lessc %~dp0Default\theme.less > %~dp0..\Styles\Default.css
出口.Release.bat:
lessc %~dp0Default\theme.less > %~dp0..\Styles\Default.css -x
两个脚本都将在以下目录中输出 css:
{ApplicationRoot}
Styles
Default.css
根据构建配置,该Debug
模式将以“人类可读”模式呈现 css,因此我可以轻松地修复它的问题。该Release
模式将使 css 缩小,准备好用于生产。
每次构建项目时,我都会自动将我的 less 文件编译为所需的 css 文件。
我在使用这种方法时也遇到了一些缺点。一个缺点是,Visual Studio 的默认 CSS 语法检查器无法识别的一些有效 CSS3 结构也会在 less 文件中加下划线。但是,除了在使用>
令牌的地方外,它仅在 less 中可用的嵌套声明存在不可见的问题。