问题描述
我正在使用Rails应用程序，该应用程序使用的是字体真棒的免费npm软件包。
我在'a包中包含了超棒的字体资源：
applcation.js在开发和生产中一切都很好。
然后，我添加了另一个软件包require("@rails/ujs").start();
require("@rails/activestorage").start();
require("@fortawesome/fontawesome-free/js/all"); // this line
，该软件包在splideJS中包含一个CSS文件。我已将node_modules包中的css文件导入为fontawesome：
application.js这对开发有效，但不适用于生产。为什么？
我的想法是，webpacker只编译js文件，而不编译生产中的CSS。因此，我尝试使用require("@rails/ujs").start();
require("@rails/activestorage").start();
require("@fortawesome/fontawesome-free/js/all");
require("@splidejs/splide/dist/css/splide.min");
使webpacker编译CSS文件，并在stylesheet_pack_tag文件夹中创建application.scss文件。
packs现在，webpacker正在编译splideJS样式表，并且正在生产中。 但字体真棒停止工作。 为什么？
另一个问题，// packs/application.scss
@import "@splidejs/splide/dist/css/splide.min";
// application.html.haml
= stylesheet_pack_tag "application",media: "all"
中的这行是什么？只能在生产中将其设置为false，我尝试将其更改为true，但也无效。
webpacker.yml解决方法
我不知道这是否对您有帮助，但是我导入Splide on Rails 6（在dev和prod上工作）的方式是在application.js上使用“ import”选项并将其安装：
import Splide from '@splidejs/splide';
document.addEventListener('turbolinks:load',() => {
// Call your functions here,e.g:
// initSelect2();
new Splide( '.splide' ).mount();
});
对于CSS，我像在application.scss上一样导入：
@import "@splidejs/splide/dist/css/splide.min";
希望这对您有所帮助。 最好！