这是针对任何库解决此问题的通用方法。
在本地重现错误
在生产环境中运行 rails 服务器
- 在终端
rake assets:precompile
这在config/environments/production.rb
# Rails 4 production
# config.serve_static_files = true
# Rails 5, Uncomment to run production on local
# config.log_level = :debug
config.public_file_server.enabled = true
- 在终端
RAILS_ENV=production rails s
- 您应该在网络浏览器上看到错误
覆盖字体系列
application.css
需要重命名为application.scss
因为asset-url
将被使用
添加字体以在文件上进行预编译config/initializers/assets.rb
:
Rails.application.config.assets.precompile << /\.(?:svg|eot|woff|ttf)$/
在 CSS 库中查找字体定义并将其复制到application.scss
. 它应该是这样的:
@font-face {
font-family: 'my-library';
src: url('../fonts/my-library.eot');
src:
url('../fonts/my-library.eot?#iefix') format('embedded-opentype'),
url('../fonts/my-library.woff2') format('woff2'),
url('../fonts/my-library.ttf') format('truetype'),
url('../fonts/my-library.woff') format('woff'),
url('../fonts/my-library.svg?#my-library') format('svg');
font-weight: normal;
font-style: normal;
}
改成:
@font-face {
font-family: 'my-library';
src: asset-url('my-library/fonts/my-library.eot');
src:
asset-url('my-library/fonts/my-library.eot?#iefix') format('embedded-opentype'),
asset-url('my-library/fonts/my-library.woff2') format('woff2'),
asset-url('my-library/fonts/my-library.ttf') format('truetype'),
asset-url('my-library/fonts/my-library.woff') format('woff'),
asset-url('my-library/fonts/my-library.svg?#my-library') format('svg');
font-weight: normal;
font-style: normal;
}
做了哪些改变
- 使用
asset-url
代替url
- 改变
../fonts
或类似asset-url
理解的路径。
放在 assets-url 上的路径
要知道哪条路径asset-url
可以理解,请转到 rails 控制台并输入Rails.application.assets.paths
. 你会得到类似的东西:
[
'/path/1',
'/path/2',
'/path/3',
]
如果您的字体已打开,请/path/2/my-library/fonts/
使用
asset-url('my-library/fonts/my-library.eot')
.
即您删除了您在 上找到的那部分的路径Rails.application.assets.paths
。
检查你写了正确的路径
在 Rails 控制台上进行开发:
helper.asset_url('my-library/fonts/my-library.eot')
应该返回:
"/assets/my-library/fonts/my-library-2517b97e2c0e1e6c8ceb9dd007015f897926bc504154137281eec4c1a9f9bdc9.eot"
注意最后一部分的尾随/assets/
和摘要。