如何编译引导程序以获得与预编译相同的版本？答案

【问题标题】：How to compile bootstrap to get the same version as precompiled?如何编译引导程序以获得与预编译相同的版本？
【发布时间】：2016-08-29 08:16:14
【问题描述】：

我买了一个模板。如果我尝试使用预编译版本的引导程序编译它，一切都很好。

@import "bootstrap.css"; //Precompiled Bootstrap
@import "nifty/nifty.less"; //My theme

但是，如果我将编译 bootstrap less 变体，则某些颜色与预期不同：

@import "bootstrap/bootstrap.less"; //Same Version as above, but not precompiled
@import "nifty/nifty.less"; //My theme

有什么区别。我应该如何编译引导程序，以在颜色方面与dist 文件夹中的预编译变体具有完全相同的结果？

我需要这个，因为我需要将我的模板与 Kendo UI 一起编译，而且我的模板并未提供 Kendo UI Bootstrap Mapper 所需的所有主题变量。

这是我的 gulp 任务：

gulp.task('theme',
    function () {
        return gulp.src('./Content/less/theme.less')
          .pipe(plumber())
          .pipe(less({
              paths: [path.join(__dirname, 'less', 'includes')]
          }))
          .pipe(gulp.dest('./Content/theme'));
    });

【问题讨论】：

你能从你的 Gulpfile 的 less 任务中发布代码吗？
另外，在终端直接使用lessc编译的结果是什么？ IE。这是否给出了预期的结果，还是您有同样的问题？
我已经添加了我的 gulpfile @AndrewFaulkner。不知道最后一个怎么做。我使用 Visual Studio。
很公平。好吧，试试这个：打开一个终端。导航到项目根目录。运行这个命令：npm install -g less ... 然后这个命令：lessc ./path/to/your/less/file.less。（因为你不是终端人，我承认这可能有点棘手，但值得一试）
还有，你是怎么在项目中安装less和bootstrapless的？即是通过 npm、bower、手动下载（直接将下载的文件放到样式文件夹中）还是其他方法？

标签： twitter-bootstrap less gulp-less

【解决方案1】：

这里有几个可能的问题：

您的项目中可能没有安装等效的 Bootstrap CSS 和 Bootstrap less 版本。确保 bootstrap.css 文件顶部列出的版本与 bootstrap.less 顶部的版本相同。这是最可能的原因 - 这些很容易失步。
确保您拥有最新的无 gulp 版本。该插件过去曾报告过一些与导入处理有关的问题，这些问题已得到修复。
Gulp-less 可能不尊重您的导入“订单” - 过去曾报告过这方面的问题。如果这是问题所在，那么您将面临一段艰难的时期。但是，如果是这种情况，您可以使用一个 hackish 解决方案：直接使用 gulp 抓取并渲染引导库文件，将它们输出到“源”中的 css 文件中（例如样式/lib/bootstrap），然后导入输出的css 文件。仅将此作为绝对的最后手段 - 这是一个重大的重大黑客攻击。
模板本身可能包含与您安装的版本不同的 Bootstrap 版本。检查模板以查看它具有哪些依赖项。

【讨论】：

谢谢，我看看。似乎第 3 号很可能是这种情况。我使用最新的 gulp-less 版本（NPM 包 json "gulp-less": "*"），并且 bootstrap.css/less 文件来自同一个下载（3.3.6，因为模板不是与 3.3.7 更新的）
确认，锁定您的版本！如果你不这样做，你以后会给自己带来很多痛苦。（这可能与您当前的问题无关，但这是个好主意）
嗯...检查您的项目中是否还安装了无引导程序。导入“引导”；可能默认为 node_modules/bootstrap-less 而不是 node_modules/bootstrap/[/*?]bootstrap.less
是的，它是 3 号。看来我需要考虑其他策略。谢谢。