5

我觉得捆绑应该用于将您一起使用的一堆文件组合成一个单一的交付给浏览器。这意味着例如对于我的根风格，我想做如下的事情：

var bundle = new StyleBundle("~/Content/style").Include(
    "~/Content/mystyle.less",
    "~/Content/bootstrap.css",
    "~/Content/bootstrap-responsive.css");
bundle.Transforms.Add(new LessTransform());
bundle.Transforms.Add(new CssMinify());
bundles.Add(bundle);

但这似乎不适用于捆绑较少文件的自定义转换技术，因为它看起来像是在将所有文件传递给 LessTransform 之前将所有文件预先捆绑到单个 css 文件中。据我所知，此方法仅在您将所有较少的文件捆绑在一起时才有效。

有没有办法让包允许在同一个包中同时使用 less 和 css 文件？

4

4 回答 4

4

是的，你是对的，转换器在将所有 CSS/LESS 内容传递给转换器之前将其连接起来。也就是说，转换器不应该同时存在 LESS 和 CSS，因为您始终可以在 LESS 样式表中包含标准 CSS。

问题似乎是您正在使用一个StyleBundle已经关联了变压器的对象。Bundle尝试像我在配置中那样使用泛型，如下所示：

var customStyles = new Bundle("~/bundle/style/css")
                       .Include("~/Content/normalize.css","~/Content/*.less");
bootstrapStyles.Transforms.Add(new LessTransform());
bootstrapStyles.Transforms.Add(new CssMinify());
bundles.Add(customStyles);

至于您自己在下面的答案，bootstrap.css 文件的问题不是 LESS 转换器不喜欢它，而可能是 @imports 的路径问题，请确保您的 LESS 转换器使用某些东西来确保它解析正确的路径到任何依赖样式表。

于 2012-10-12T22:35:35.210 回答
2

我相信所有的 CSS 都是有效的 LESS（但并非所有的 LESS 都是有效的 CSS）

因此，将其LessTransform应用于您的引导 css 文件应该没有任何区别。

它仍然会将所有文件捆绑到一个 css 文件中以传递给浏览器。

在设计时可能只存在性能问题。

仍然会产生正确的输出，并且缓存将防止任何运行时性能问题。

于 2012-10-01T13:31:12.247 回答
2

我知道这是一个有点旧的帖子，但我注意到一些奇怪的东西可能对某人有用......

当还包含较少的文件时，我发现该Bundle对象不喜欢 css 文件名称中的连字符。IE：

var frontendStyles = new Bundle("~/bundles/frontend.main.css")
            .IncludeDirectory("~/Content/less", "*.less")
            .Include(
                "~/Content/ladda.css",
                "~/Content/jquery.mobile.custom.structure.min.css",
                "~/Content/jquery-ui.1.9.2.custom.css"
            );

对我不起作用，但以下操作（更改为 jqueryui 文件名）：

var frontendStyles = new Bundle("~/bundles/frontend.main.css")
            .IncludeDirectory("~/Content/less", "*.less")
            .Include(
                "~/Content/ladda.css",
                "~/Content/jquery.mobile.custom.structure.min.css",
                "~/Content/jqueryui.1.9.2.custom.css"
            );

因此，将文件名从 更改"~/Content/bootstrap-responsive.css"为"~/Content/bootstrapresponsive.css"可以很好地为您解决问题。

于 2015-10-15T09:58:45.727 回答
0

我对此进行了更多研究，并尝试使用 Bundle 而不是 StyleBundle，但仍然存在问题。我认为这个问题特别与 bootstrap.css 文件有关，它有一些不太喜欢的语法。

于 2012-10-07T01:32:37.920 回答