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 文件夹中的文件
我无法弄清楚如何将包装 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 文件夹中的文件