Rails 4 - 供应商资产字体文件

Rails 4 - vendor assets fonts file

我无法弄清楚如何将包装 bootstrap 文件集成到我的 rails 4 应用程序中。

我的供应商资产中有一个名为 fonts 的文件夹。

其中我有几个文件,名称如下:

ActionController::RoutingError (No route matches [GET] "/assets/vendor/assets/fonts/Simple-Line-Icons.woff"):

我的 vendor/assets/stylesheets,我有一个名为 simple-line-icons.css 的文件,其中包含:

@font-face {
    font-family: 'Simple-Line-Icons';
    src:url('vendor/assets/fonts/Simple-Line-Icons.eot');
    src:url('vendor/assets/fonts/Simple-Line-Icons.eot?#iefix') format('embedded-opentype'),
        url('vendor/assets/fonts/Simple-Line-Icons.woff') format('woff'),
        url('vendor/assets/fonts/Simple-Line-Icons.ttf') format('truetype'),
        url('vendor/assets/fonts/Simple-Line-Icons.svg#Simple-Line-Icons') format('svg');
    font-weight: normal;
    font-style: normal;
}

当我保存所有内容并预编译资产时,我的控制台错误日志显示:

Failed to load resource: the server responded with a status of 404 (Not Found)
http://localhost:3000/assets/vendor/assets/fonts/Simple-Line-Icons.ttf Failed to load resource: the server responded with a status of 404 (Not Found)

任何人都可以看到需要发生什么才能让它工作吗?

采纳下面的建议,我现在有:

@font-face {
    font-family: 'Simple-Line-Icons';
    /*src:url('vendor/assets/fonts/Simple-Line-Icons.eot');*/
    src:asset-url("fonts/Simple-Line-Icons.eot");
    src:asset-url("fonts/Simple-Line-Icons.eot?#iefix") format('embedded-opentype'),
    asset-url("fonts/Simple-Line-Icons.woff") format('woff'),
    asset-url("fonts/Simple-Line-Icons.ttf") format('truetype'),
    asset-url("fonts/Simple-Line-Icons.svg#Simple-Line-Icons") format('svg');

inside simple-line-icons.css.erb

但我仍然收到 404 错误

.erb 添加到 css 文件的末尾,然后将 url('vendor/assets/fonts/Simple-Line-Icons.eot') 更改为 asset-url("fonts/Simple-Line-Icons.eot") 并与其他文件相同。我认为问题是在你预编译文件后,rails 会在文件中添加一个随机标记,例如 "/assets/application-908e25f4bf641868d8683022a5b62f54.js",所以如果你使用 'vendor/assets/fonts/Simple-Line-Icons.eot',你找不到文件。

更新

将您的 simple-line-icons.css.erb 文件更改为 simple-line-icons.scss 然后

@font-face {
  font-family: 'simple-line-icons';
  src: asset-url('Simple-Line-Icons.eot?v=2.2.2');
  src: asset-url('Simple-Line-Icons.eot?v=2.2.2#iefix') format('embedded-opentype'), asset-url('Simple-Line-Icons.ttf?v=2.2.2') format('truetype'), asset-url('Simple-Line-Icons.woff2?v=2.2.2') format('woff2'), asset-url('Simple-Line-Icons.woff?v=2.2.2') format('woff'), asset-url('Simple-Line-Icons.svg?v=2.2.2#simple-line-icons') format('svg');
  font-weight: normal;
  font-style: normal;
}

在您的 application.css 文件末尾添加以下内容:

*= require simple-line-icons

因为显然 require_tree。不需要您的供应商和 lib 文件夹中的文件