Webpacker未配置为提取任何css。
1.在webpacker.yml中设置extract_css: true。将此设置为true将提取您在/packs下的js文件中导入的任何css以分隔css文件。在您的情况下，在application.js中导入的任何css将在application.css中可用。如果您有一个名为test的包，则css将被提取到test.css。
1.将application.scss从packs移出到/css（或stylesheets，无论您想要什么）
1.更新application.js，如下所示：

import "./../css/application";
import Rails from "@rails/ujs";
....

1.请确保使用bin/webpacker-dev-server启动webpacker dev服务器。

以下是它的外观：

With Shakapacker:

app/javascript:
├── packs:
│   # only webpack entry files here
│   └── online_giving.js
│   └── online_giving.scss
└── src:
│   └── my_component.js
└── stylesheets:
│   └── my_styles.css
└── images:
  └── logo.svg

And in the app/views/layouts/mylayout.html.haml :

= javascript_pack_tag 'online_giving'
= stylesheet_pack_tag 'online_giving'

you don't need to import the online_giving.scss in the online_giving.js file, Shakapacker will find it.