rails 6 heroku资产预编译在生产环境中不工作_Heroku_Webpack_Asset Pipeline_Ruby On Rails 6_Tailwind Css

rails 6 heroku资产预编译在生产环境中不工作

heroku webpack

rails 6 heroku资产预编译在生产环境中不工作,heroku,webpack,asset-pipeline,ruby-on-rails-6,tailwind-css,Heroku,Webpack,Asset Pipeline,Ruby On Rails 6,Tailwind Css,我有一个rails 6，tailwind应用程序，它在开发中运行良好。但当我把它推给heroku时，资产编译似乎不起作用。结果是生产应用程序中没有CSS 通过执行以下操作，我成功地在本地计算机上复制了相同的错误： RAILS\u ENV=生产包执行rake资产：预编译然后我也没有在我的本地应用程序上显示css。当我这样做的时候 RAILS\u ENV=开发包exec rake资产：预编译它又起作用了这是我的bin/webpack文件： ENV["RAILS_ENV"

我有一个rails 6，tailwind应用程序，它在开发中运行良好。但当我把它推给heroku时，资产编译似乎不起作用。结果是生产应用程序中没有CSS

通过执行以下操作，我成功地在本地计算机上复制了相同的错误： RAILS\u ENV=生产包执行rake资产：预编译

然后我也没有在我的本地应用程序上显示css。当我这样做的时候 RAILS\u ENV=开发包exec rake资产：预编译

它又起作用了

这是我的bin/webpack文件：

ENV["RAILS_ENV"] ||= ENV["RACK_ENV"] || "development"
ENV["NODE_ENV"]  ||= "development"

require "pathname"
ENV["BUNDLE_GEMFILE"] ||= File.expand_path("../../Gemfile",
Pathname.new(__FILE__).realpath)

require "bundler/setup"

require "webpacker"
require "webpacker/webpack_runner"


APP_ROOT = File.expand_path("..", __dir__)
Dir.chdir(APP_ROOT) do
  Webpacker::WebpackRunner.run(ARGV)
end

这是我的application.html.erb：

<!DOCTYPE html>
<html>
  <head>
    <title></title>
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <%= csrf_meta_tags %>
    <%= csp_meta_tag %>
    <link rel="stylesheet" href="https://rsms.me/inter/inter.css"

    <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
    <%= stylesheet_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
    <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
  </head>

  <body>
    <%= flash[:alert] %>
    <%= flash[:notice] %>
    <%= yield %>
    <%= render 'layouts/footer' %>
  </body>
</html>

这是我的tailwind.config.js

let environment = {
  plugins: [
    require('tailwindcss')('./app/javascript/stylesheet/tailwind.config.js'),
    require('postcss-import'),
    require('postcss-flexbugs-fixes'),
    require('postcss-preset-env')({
      autoprefixer: {
        flexbox: 'no-2009'
      },
      stage: 3
    })
  ]
};

// Add everything below!
if (process.env.RAILS_ENV === 'production') {
  environment.plugins.push(
    require('@fullhuman/postcss-purgecss')({
      content: [
        './app/**/.html.erb',
        './app/helpers/**/*.rb',
        './app/javascript/**/*.js',
        './app/javascript/**/*.jsx',
      ],
      defaultExtractor: (content) => content.match(/[A-Za-z0-9-_:/]+/g) || []
    })
  )
}

module.exports = environment;

module.exports = {
  purge: [
  './app/**/*.html.erb',
  './app/helpers/**/*.rb',
  './app/javascript/**/*.js'
  ],
  darkMode: false, // or 'media' or 'class'
  theme: {
    extend: {
      fontFamily: {
        sans: ['Inter var'],
      },
    },
  },
  variants: {
    extend: {},
  },
  plugins: [],
}

还有我的package.json

{
  "name": "myapp",
  "private": true,
  "dependencies": {
    "@rails/actioncable": "^6.0.0",
    "@rails/activestorage": "^6.0.0",
    "@rails/ujs": "^6.0.0",
    "@rails/webpacker": "5.2.1",
    "tailwindcss": "npm:@tailwindcss/postcss7-compat",
    "turbolinks": "^5.2.0",
    "webpack": "^4.0.0"
  },
  "version": "0.1.0",
  "devDependencies": {
    "autoprefixer": "^9",
    "postcss": "^7",
    "webpack-dev-server": "^3.11.2"
  },
  "workspaces": {
    "nohoist": [
      "**/tailwindcss",
      "**/@tailwindcss/**"
    ]
  }
}