问如何使用Asp.net MVC5和Web Essentials 2013编译Twitter Bootstrap 3.0 LESS

EN

更新(29-SEP-2015)：

离开Web Essentials，使用更少的编译器和它的Clean CSS插件。

1. 下载并安装 (32位)Windows.
   1. node.js命令使用以下命令：npm install -g less
   2. Install using npm install -g to Project Properties > Build Events -g copy-paste for - Pre-build Events命令行框：

清理"$(ProjectDir)Content\bootstrap\bootstrap.less“"$(ProjectDir)Content\bootstrap.css”---css=“--s1清理项目并在指定位置查找bootstrap.css。(如果还没有，您可能需要在解决方案中启用“显示所有文件”设置，将bootstrap.css文件Explorer.)

• Include到您的项目中。查看文件属性并将其“Build Action”设置为“Content”。更新bootstrap以将此编译文件包含到您的StyleBundle.

• Select中\Content\ BundleConfig文件夹中的所有.less文件中。查看文件属性并将其“生成操作”设置为“无”。

更新(24-SEP-2014)：

由于Twitter Boostrap已经从休会切换到了Grunt，我建议正在寻找这个解决方案的新用户考虑一下：LESS Compiler或Grunt。

请注意，此处提到的解决方案中的none使用Web Essentials 2013。

最后，我决定使用Twitter推荐的休息。如果你想在使用Visual Studio 2013 (RC / RTM)的css中使用预建的bootstrap 3 less，你可以按照下面的步骤操作：

全局下载并安装适用于Windows.

• Install npm包的

1. (32位)-打开node.js命令提示符，然后运行命令：

npm安装recess–g

• Use NuGet库程序包管理器，并将程序包安装到您的Asp.Net MVC 5 NuGet/ Azure Web角色项目中。

• 转到项目属性>生成事件并复制-粘贴以下命令以预生成事件命令行: box：

bootstrap recess "$(ProjectDir)Content\bootstrap\bootstrap.less“-- "$(ProjectDir)Content\bootstrap-compiled.css"

• Build >项目，并在指定位置查找bootstrap-”$(ProjectDir)Content\bootstrap-compiled.css“

• Build.css。(如果还没有，您可能需要在解决方案中启用“Show All Files”设置，将bootstrap- Explorer.)

• Include .css文件添加到您的项目中。查看文件属性并将其“Build Action”设置为“Content”。更新bootstrap以将此编译文件包含到您的StyleBundle.

• Select中\Content\ BundleConfig文件夹中的所有.less文件中。查看文件属性并将其“生成操作”设置为“无”。

可以对相同的方法示例使用'lessc‘命令：

   lessc "$(ProjectDir)Content\bootstrap\bootstrap.less"  "$(ProjectDir)Content\bootstrap-compiled.css"