使用 SASS 引导答案

【问题标题】：Bootstrap with SASS使用 SASS 引导
【发布时间】：2014-05-30 22:19:26
【问题描述】：

我想使用 SASS 版本的 Bootstrap 3，但是 JS 模块不起作用。

我的 bootstrap.js：

//= require bootstrap/affix
//= require bootstrap/alert
//= require bootstrap/button
//= require bootstrap/carousel
//= require bootstrap/collapse
//= require bootstrap/dropdown
//= require bootstrap/tab
//= require bootstrap/transition
//= require bootstrap/scrollspy
//= require bootstrap/modal
//= require bootstrap/tooltip
//= require bootstrap/popover

什么是require，它是如何工作的？我以前从未见过normalbootstrap。

【问题讨论】：

这是一个 Rails 的 require 语法，基本上就像 SASS Import 查询来导入部分。
我该如何与他们合作？
答案如下。

标签： javascript twitter-bootstrap twitter-bootstrap-3

【解决方案1】：

这是一个 JavaScript 清单，Rails 使用它来加载 Bootstrap 插件。
使用此清单，您可以快速禁用单个插件。

如果你不使用 Rails，你有两种选择：

加载您需要的每个插件

<script src="assets/js/bootstrap/affix.js"></script>
<script src="assets/js/bootstrap/alert.js"></script>
<script src="assets/js/bootstrap/button.js"></script>
...

使用`bootstrap.js`的编译版本

您可以在 Bootstrap CDN 上找到它：

<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>

（包括远程脚本，或将其复制/粘贴到您的项目中）

【讨论】：

谢谢，您的回答帮助我理解了问题。我认为 Bootstrap 是用于简单的 html/css 开发，但似乎 Rails 开发人员也使用它。
Web 开发人员使用工具/框架来提高生产力，例如 Rails... 或 SASS！这并不意味着他们不再制作 HTML/CSS/JS，他们只是让它变得更好、更快、更强大。

【解决方案2】：

我在使用它们的部分时遇到了同样的问题，我建议您在单独的缩小 BS3 文件中推出 Bootstrap 3，但是如果您希望将它们保留在部分中，请在单独的 Javascript 文件中使用以下内容...

var includeFiles = [
    'affix',
    'alert',
    'button',
    'carousel',
    'collapse',
    'dropdown',
    'tab',
    'transition',
    'scrollspy',
    'modal',
    'tooltip',
    'popover'
];

for(var i=0; i < includeFiles.length; i++) {
    $('body').append($('<script src="partials/'+includeFiles[i]+'"></script>'));
}

当然 .append 方法中的路径完全取决于您的文件结构，请根据您的需要进行编辑。

但是，如果您真的想使用这些 require 语句，那么请使用 Rails 框架，您可以在 http://rubyonrails.org/ 阅读该框架

【讨论】：

添加带有for的js文件对我来说有点奇怪。我想知道，使用这些文件的最佳做法是什么。
该方法是几年前一位高级开发人员在类似问题上提供给我的，可能会有更好的方法，但主要是原始 Javascript，干净且可读。

加载您需要的每个插件

使用bootstrap.js的编译版本

使用`bootstrap.js`的编译版本