Twitter引导项目结构

我在每个项目之前面临的最大困境是我是否需要使用整个Bootstrap或仅使用它的所需部分。我浪费了很多时间来决定这一点。Twitter引导项目结构

我的设定，到目前为止一直是这样的：

复制从Twitter /引导较少目录到我的样式表目录

├── bootstrap 
│   ├── layouts.less 
│   └── more... 
├── fonts.less 
├── mixins.less 
├── mysite.less 
├── plugins.less 
└── variables.less

创建plugins.less文件，包括必需的引导少的文件。它看起来是这样的：

@import "bootstrap/layouts.less"; 
    @import "bootstrap/type.less"; 
    @import "bootstrap/forms.less"; 
    @import "bootstrap/buttons.less"; 
    @import "bootstrap/utilities.less";

然后，在我的main.less文件中使用这个plugins.less。

@import "fonts.less" 
    @import "variables.less"  // Bootstrap's + my variables 
    @import "mixins.less"  // Bootstrap's + my mixins 
    @import "plugins.less" 
    @import "mysite.less"

从博客文章和讨论我所看到的，它看起来像大多数人只是包括bootstrap.css，引导-responsive.css并覆盖custom.css样式。虽然我明白这会尽量减少项目的“自举”ping时间，但我担心会出现膨胀和维护。当我使用这种方法时，通过检查员可以看到数百种风格被覆盖。另外，我可能会意外地使用bootstrap使用的类名。

我使用的方法有什么缺点吗？或者我应该只使用http://twitter.github.com/bootstrap/customize.html并覆盖custom.less中的某些类？

来源

2012-12-18 dheerosaur

就我个人而言，我包含了我的项目所需的较少文件，然后自定义给定的类来做我所需要的。如果我需要添加自定义类，我会在custom.less中执行。

虽然每个项目都不一样，所以让Bootstrap为你工作。该网站是否会维持多年？也许你想花时间去除未使用的较少文件并修改现有的类来完成你所需要的。如果项目需要快速完成，也许网站会很短，只需包含所有.less文件并覆盖custom.less

知道在Bootstrap版本3中，所有的少于一个文件http://blog.getbootstrap.com/2012/12/10/bootstrap-3-plans/。就我个人而言，我喜欢使用一个大文件而不是处理许多无用文件。

来源

2012-12-18 15:15:57 runningRhetoric

这是我的设置看起来像：

|-bootstrap (as cloned from github) 
| 
|-css 
| |-app.css 
| |-app.less (watched by LESS compiler) 
| 
|-js 
| |-app.js 
| |-plugins 
| 
|-img 
| 
|-index.html

我包括我的app.less文件引导文件，这是我从编译调用终端少的编译器，以app.css（我链接这一个在我的HTML模板）

这样我可以引导随时随地（在引导文件夹的简单git pull）

来源

2013-10-07 09:11:15

安全升级覆盖，你可以在课堂上指定的样式，而不是和你需要的地方使用使用这些类样式。这样你就不会搞砸了覆盖很多风格和混合现有的引导类。你可以像这样使用namepsacing。

<div class="navbar navbar-default pn-navabr"> 
    <div class="navbar-inner"> 
    // Inner code 
    </div> 
</div> 

.pn-navabr{ // Pn is project name initials, you can choose anything you like maybe dev's name initials 

} 
.pn-navabr .navabr-inner{ 

}

这样你才能真正清理你的CSS，并没有搞乱和压倒一切的核心引导它真正可扩展的。并且您将始终具有使用Sass，Less，混合或纯CSS的灵活性。

来源

2013-12-03 18:29:35 ravisuhag

Twitter引导项目结构

回答

相关问题