如何在VS 2013中编译Bootstrap LESS源代码

时间:2014-11-23 19:25:08

标签: twitter-bootstrap visual-studio less web-essentials

我安装并更新了visual studio 2013 Ultimate Update 4以及Web Essentials 我下载bootstrap V3.3.1源代码我将css,js,fonts和less文件夹复制到visual studio。

现在我想在我编辑后编译所有.less文件以覆盖bootstrap.css文件,我选择了解决方案资源管理器中的所有文件并右键单击但禁用了所有Web Essentials菜单项。

将所有文件编译为.css文件应该遵循哪些步骤,或者我应该使用与Web Essentials不同的工具?

enter image description here

1 个答案:

答案 0 :(得分:10)

对于记录,当前Web Essentials将在编辑时重新编译任何已编译的文件,包括非CSS生成文件,如variables.less。您只需要在第一次手动编辑它们就可以将它们置于此模式。例如,想要重新标记Bootstrap变量的新项目的过程是:

  1. 确保已安装当前的Web Essentials Visual Studio软件包。
  2. 将Bootstrap Source NuGet包添加到站点。
  3. 手动编辑您想要自动生成的文件,例如/Content/bootstrap/bootstrap.less和theme.less。保存时,将发生第一次编译,生成.css和min.css作为解决方案资源管理器中的相关项。
  4. 现在,当您编辑相关文件(例如,变量无法进行品牌推广)时,编译的引导程序和主题CSS会在构建期间自动更新。
  5. 关于此问题的唯一肮脏部分是您第一次编辑原始来源,更改时间戳。希望这不会导致将来更新NuGet包时出现问题。

    Web Essentials项目中有一个未解决的问题。一个简单的解决方案是获取上下文菜单选项以在第一次手动执行,另一个是Visual Studio中文件的永久设置,例如构建操作或自定义工具操作。

    https://github.com/madskristensen/WebEssentials2013/issues/1632

    您可以在Visual Studio“工具 - 选项 - Web Essentials - LESS”设置中更改重新编译的行为。