Rails 5.1 + Webpack....CSS中的图片？

Question

Rails 5.1 + Webpack....CSS中的图片？

ruby-on-railswebpackruby-on-rails-5ruby-on-rails-5.1

8

我正在努力学习如何使用--webpack方法来管理一个非常简单的Rails 5.1应用程序中的JS和CSS（特别是scss）。

但是这太让人沮丧了，因为我找不到任何关于如何做最基本的东西的文档。

我该如何从我的css文件中链接一张图片呢？

像这样：background-image: asset-url('header.jpg')。

- Tallboy

你尝试过阅读文档了吗？ - Roman Kiselenko

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Piotr Galas · Accepted Answer

您可以使用默认的webpack-rails配置。请按照我在注释中添加的路径操作。

您的布局应包括特殊标签：

 # app/views/layouts/application.html.erb

<head>
    <%= javascript_pack_tag 'include_js_logic_here' %>
    <%= stylesheet_pack_tag 'include_stylesheet_here' %>
</head>

包括在此处的样式表.js

# app/javascript/packs/include_stylesheet_here.js
import 'react-select/dist/react-select.css'; #exmple how to get styles from library 
import './stylesheets/application.scss';

应用程序.scss

#app/javascript/packs/stylesheets/application.scss
body{
  background-image: url('../img/arrow-right-red.svg');
}

图片路径为：

app/javascript/packs/img/arrow-right-red.svg