Visual Studio - 预编译 - dotless

发布于 2024-08-19 12:07:19 字数 271 浏览 12 评论 0原文

我想知道是否有办法预编译 *.less 文件(http://www. dotlesscss.org/）与 Visual Studio。

该网站给了我一个 dotless.compiler.exe 但我不知道如何将其连接到 Visual Studio。我正在寻找适用于 Webforms 和 ASP.NET MVC 的解决方案。

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

握住你手 2024-08-26 12:07:19

根据您的构建环境，您可以将 dotless.Compiler.exe 作为构建任务启动。

例如，在 Visual Studio 中使用预构建任务（全部 1 行）：

$(SolutionDir)Tools\dotLess\dotless.compiler.exe -m 
    $(ProjectDir)content\css\site.less $(ProjectDir)content\css\site.css

宏（$(SolutionDir) 等）允许项目和文件位置具有一定的灵活性。无需使用标准 .less 文件，只需在标记中引用新的 .css 文件即可。

Depending on your build environment, you can kick off dotless.Compiler.exe as a build task.

For example, using a Pre-Build task in Visual Studio (all 1 line):

$(SolutionDir)Tools\dotLess\dotless.compiler.exe -m 
    $(ProjectDir)content\css\site.less $(ProjectDir)content\css\site.css

The macros ($(SolutionDir), etc) allow a bit of flexibility to project and file locations. Rather than using the standard .less files, simply reference the new .css files in your markup.

回复收藏 0 原文

固执像三岁 2024-08-26 12:07:19

所有，

在使用了这里讨论的几乎所有替代方案并且不满意之后，我为 Visual Studio 编写了一个 LessCss 编译器插件。仅当 .less 文件发生更改时，它才会使用 .less 文件并生成 .css 文件。它使用最新最好的 less.js 编译器。

在此处查看其使用情况。

下载已签名的扩展。

源代码在这里。

我刚刚将其提交到 VS 扩展库。希望它很快就会出现，但同时请安装（或编译然后安装）并检查它。

回复收藏 0 原文

新人笑 2024-08-26 12:07:19

Phil Haack 来救援：http:// haacked.com/archive/2009/12/02/t4-template-for-less-css.aspx

每当您希望在编译时在解决方案中生成某些内容时，T4 通常是最佳选择。。

回复收藏 0 原文

时间海 2024-08-26 12:07:19

这是我使用 MSBuild 提出的解决方案。它是增量的，因此只有当 Less 发生变化时才会发生。它还可以正确处理@import。

首先，使用 NuGet 将 dotless 添加到您的项目中。您不需要它添加到您的 web.config 中的任何魔力，因此您可以恢复它 - 您只是使用它来获取编译器可执行文件。

接下来，将“根”Less 文件添加到 .csproj 中，如下所示：

<ItemGroup>
    <LessCssRootInput Include="example.less" />
</ItemGroup>

最后，将此代码段添加到 .csproj 的底部：

<ItemGroup>
    <LessCssSubInput Include="**\*.less" Exclude="@(LessCssRootInput)" />
    <LessCssOutput Include="@(LessCssRootInput -> '%(RelativeDir)\%(Filename).css')" />
</ItemGroup>
<Target Name="CompileLessCss" BeforeTargets="Compile" Inputs="@(LessCssRootInput);@(LessCssSubInput)" Outputs="@(LessCssOutput)">
    <Exec Command=""$(SolutionDir)\packages\dotless.1.3.1.0\tool\dotless.compiler.exe" --minify --keep-first-comment @(LessCssRootInput)" />
</Target>

Here's the solution I came up with, using MSBuild. It's incremental, so it should only happen when the Less changes. It also correctly handles @import.

First, add dotless to your project with NuGet. You don't need any of the magic it adds to your web.config, so you can revert that - you're just using it to get the compiler executable.

Next, add your "root" Less files to your .csproj, like so:

<ItemGroup>
    <LessCssRootInput Include="example.less" />
</ItemGroup>

Finally, add this snippet at the bottom of your .csproj:

<ItemGroup>
    <LessCssSubInput Include="**\*.less" Exclude="@(LessCssRootInput)" />
    <LessCssOutput Include="@(LessCssRootInput -> '%(RelativeDir)\%(Filename).css')" />
</ItemGroup>
<Target Name="CompileLessCss" BeforeTargets="Compile" Inputs="@(LessCssRootInput);@(LessCssSubInput)" Outputs="@(LessCssOutput)">
    <Exec Command=""$(SolutionDir)\packages\dotless.1.3.1.0\tool\dotless.compiler.exe" --minify --keep-first-comment @(LessCssRootInput)" />
</Target>

回复收藏 0 原文