使用Grunt时在Bower组件中找不到CSS文件

我正在尝试将CSS样式表从组件导入到.sass文件中。在本例中，组件为引导选择，导入如下所示：

@import 'bootstrap-select/bootstrap-select.css'

此操作已成功生成，但浏览器无法找到文件，我在浏览器中收到以下错误：

GET http://localhost:9000/styles/bootstrap-select/bootstrap-select.css 404 (Not Found)

---

有什么特别的设置需要在构建中包含.css文件吗？

为了将文件的代码导入到Sass文件中，导入的文件需要有

.Sass

或

.scss

结尾。如果文件以

.css

结尾，代码将不会被吸入，它只是一个创建HTTP请求的常规css

@import

语句

---

只需复制要导入的css文件，将文件结尾更改为

.scss

和

@import

该文件即可。然后，Sass将吸入代码并在CSS文件中用它替换

@import

语句。

Kahlil所说的；但我建议使用，因为它在涉及到哪些内容可以/不能包括时，给了您更多的灵活性。我在生产中使用它，它非常好；您可以完全定制您的构建，包括变量，以便调整按钮颜色、间距等。例如：

/*
|---------------------------------------------------------------------
| Only include the parts of Bootstrap that we are actually using.
|---------------------------------------------------------------------
*/

$navbar-margin-bottom: 0;

@import "../vendor/bootstrap-sass/lib/variables";
@import "../vendor/bootstrap-sass/lib/mixins";
@import "../vendor/bootstrap-sass/lib/normalize";
@import "../vendor/bootstrap-sass/lib/print";
@import "../vendor/bootstrap-sass/lib/scaffolding";
@import "../vendor/bootstrap-sass/lib/type";

// etc

---

将它添加到您的

bower.json

（

bootstrap sass

）中，然后使用它。

有一个ruby gem，它允许使用所述的功能调用，它允许使用以下语法来包括

.scss

文件中以

.css

结尾的文件：

@import "CSS:../../bower_components/alertify/themes/alertify.core";
@import "CSS:../../bower_components/alertify/themes/alertify.default";
@import "CSS:../../bower_components/normalize-css/normalize";
@import "../../../bower_components/bourbon/app/assets/stylesheets/_bourbon";
@import "../../../bower_components/neat/app/assets/stylesheets/_neat";

它可以添加到

Gemfile

中，如下所示：

source "http://rubygems.org"
gem "sass-css-importer"

并且在

Grunfile

中需要：

sass:
  options:
    quiet: true
    require: 'sass-css-importer'
  static:
    files: [
      expand: true
      cwd: 'source/styles'
      src: ['*.scss']
      dest: 'build/styles'
      ext:

---

YMMV。祝你好运

感谢您的建议，我已经将此作为临时解决方案执行，但它违背了使用bower组件的目的。理想情况下，您希望在不进行任何手动处理的情况下安装或更新bower组件。这是事实，但您不能通过@import将CSS代码导入到Sass中，这意味着您需要一个可通过bower获得的Sass版本的引导选择。如果没有可用的Sass版本，则您无法通过Bower管理该库。感谢Ben的建议，我已经在使用Sass引导，但对于其他未准备好Sass的Bower组件（即引导选择），解决方案似乎是手动调整。对不起，我以为选择是twbs的一部分，我的错。回复：手动调整；看起来是的。如果您正在对源代码进行调整，并且您认为这对其他人是有益的，那么请向原始存储库提交一个pull请求。这将使其他正在寻找组件的SASS版本的人受益，而且如果它要更新，所有未来的版本都将从Bower包中准备好SASS。另一种方法是可能使用类似于

grunt contrib copy

的东西，并将扩展名重命名为CSS，将文件放在不同的目录中。：）