我的 tailwind 实用程序 class 在生产环境中不起作用

my tailwind utility class does not work in production

我找到了“Nirvana”(或者我应该说是 Tailwind)- 这正是我发现这个 library/framework 的好地方!它与 Rails 以及 Webpacker 配合得很好。事实上,除了这个 bugger;

之外,一切都很好

我有这个偷偷摸摸的小装置,它提供了非常易读的视图模板(是的 - 我知道 - 它显然有上百万个方面的缺陷,但它完成了工作,我能说什么)

# helpers/menusHelper

  def sidebar_nav options=nil, &block
    opt = {
      :"x-show"=>"mobileSidebarOpen" ,
      :"aria-label"=>"Sidebar",  
      :"x-description"=>"Off-canvas menu, show/hide based on off-canvas menu state." ,
      :"x-transition:enter"=>"transition ease-in-out duration-300 transform" ,
      :"x-transition:enter-start"=>"-translate-x-full" ,
      :"x-transition:enter-end"=>"translate-x-0" ,
      :"x-transition:leave"=>"transition ease-in-out duration-300 transform" ,
      :"x-transition:leave-start"=>"translate-x-0" ,
      :"x-transition:leave-end"=>"-translate-x-full" ,
      :class => "absolute left-0 flex-1 flex flex-col max-w-xs w-full pt-5 pb-4 bg-premier-blue flex-shrink-0 h-full divide-y divide-cyan-800 overflow-y-auto top-12" ,
      :style => "display: none;"
    }
    opt.merge! options if options 
    content_tag :nav, nil, opt, &block
  rescue 
    content_tag :nav, nil, { class: "sidebar_nav error" }, &block
  end

现在 - 问题是它确实有效 - 除了你看不到我距离顶部 3rem 的距离!

我喜欢 - 很多 - 实用程序 classes 并且它们都有效(或者至少我认为它们有效)!

class 未受影响 - 在网站上,我可以在导航标签上找到确切的价值;

有些事 - 嗯 - 不 - 我不知道!它位于 rails webpacker:compilegit push dokku hermes

之间

如果我偶然发现了答案,我会回来报告 -

有时答案就在您的眼皮底下 - 就像眼前的情况一样!我知道它与发生的事情有关 before 我会启动 'uploading' 服务器并且我的眼睛盯着 PostCSS;它肯定得到了回报!

我的 tailwind.config.js 告诉 PostCSS 要清理哪些文件 - 它看起来像这样:


module.exports = {
  purge: [
    './app/assets/**/*.js',
    './app/assets/**/*.coffee',
    './app/javascript/**/*.coffee',
    './app/javascript/**/*.js',
    './app/views/**/*.haml',
    './app/views/**/*.erb',
    './app/**/*.jsx',
  ],

- 但是因为我开始 'invent these little helper things' 我忘了在 PostCSS 的“购物清单”中包含 *.rb 文件!

这就是它的样子 - 至少对于我正在做的事情:

module.exports = {
  purge: [
    './app/assets/**/*.js',
    './app/assets/**/*.coffee',
    './app/javascript/**/*.coffee',
    './app/javascript/**/*.js',
    './app/views/**/*.haml',
    './app/helpers/*.rb',
    './app/views/**/*.erb',
    './app/**/*.jsx',
  ],