css - 如何使 animate.css 在 Rails 中工作？由于 animate-rails 不适用于 heroku

Question

animate-rails 不在heroku上工作，而是在本地工作。不过，Coffeescript 正在研究 heroku 生产。

rails 版本：Rails 6.1.4.1 ruby​​ 版本：ruby 3.0.2p107（2021-07-07 修订版 0db68f0233）[arm64-darwin20]

以下是各个文件中的代码：

宝石文件->gem "animate-rails"

应用程序.css.scss -> *= require animate

应用程序.js ->import 'animate.css/animate'

包.json ->"animate.css": "^4.1.1"

生产.rb ->config.assets.compile = false

.html 文件->.nav-item.animate__animated.fadeIn.animate__slower.animate__delay-2s Sample Text

application.html.slim

= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload'
= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload'

环境.js

const { environment } = require('@rails/webpacker')
const coffee = require('./loaders/coffee')
const webpack = require('webpack')
environment.plugins.append('Provide',
  new webpack.ProvidePlugin({
    $: 'jquery',
    jQuery: 'jquery',
    Popper: ['popper.js', 'default']
  })
)
environment.loaders.prepend('coffee', coffee)
module.exports = environment

Answer 1

由于您使用的是 SCSS，您可以尝试修改您的application.css.scss文件：

@import 'animate';

Answer 2

您的文件名似乎有问题application.scss，它不应该是 .css.scss。扩展名只能是 .scss。

./bin/webpack此外，如果您使用 webpacker（Rails 6 中的标准配置），您可以尝试在生产环境中运行。