ruby-on-rails Rails 7资产管道SassC：：SyntaxError with Tailwind

cbwuti44 于 12个月前发布在 Ruby

关注(0)|答案(5)|浏览(100)

我正在将一个新的Rails 7项目部署到生产环境中（在Heroku和Render.com上尝试），在构建过程中遇到以下错误：

$ tailwindcss -i ./app/assets/stylesheets/application.tailwind.css -o ./app/assets/builds/application.css

       Done in 408ms.
       Done in 0.90s.
       rake aborted!
       SassC::SyntaxError: Error: Function rgb is missing argument $green.
               on line 428 of stdin
       >>   color: rgb(29 78 216 / var(--tw-text-opacity));

          ---------^
       stdin:428

这就是我 * 认为 * 是相关的部分，但如果有帮助的话，这里还有更多的输出上下文。

Preparing app for Rails asset pipeline
       Running: rake assets:precompile
       yarn install v1.22.17
       [1/4] Resolving packages...
       [2/4] Fetching packages...
       [3/4] Linking dependencies...
       [4/4] Building fresh packages...
       Done in 5.10s.
       yarn run v1.22.17
       $ esbuild app/javascript/*.* --bundle --sourcemap --outdir=app/assets/builds
       
         app/assets/builds/application.js      185.5kb
         app/assets/builds/application.js.map  301.0kb
       
       Done in 0.10s.
       yarn install v1.22.17
       [1/4] Resolving packages...
       success Already up-to-date.
       Done in 0.12s.
       yarn run v1.22.17
       $ tailwindcss -i ./app/assets/stylesheets/application.tailwind.css -o ./app/assets/builds/application.css
       
       Done in 408ms.
       Done in 0.90s.
       rake aborted!
       SassC::SyntaxError: Error: Function rgb is missing argument $green.
               on line 428 of stdin
       >>   color: rgb(29 78 216 / var(--tw-text-opacity));
       
          ---------^
       stdin:428
       /tmp/build_d9d0bde2/vendor/bundle/ruby/3.0.0/gems/sassc-2.4.0/lib/sassc/engine.rb:50:in `render'
       /tmp/build_d9d0bde2/vendor/bundle/ruby/3.0.0/gems/sassc-rails-2.1.2/lib/sassc/rails/compressor.rb:29:in `call'
       /tmp/build_d9d0bde2/vendor/bundle/ruby/3.0.0/gems/sprockets-4.0.2/lib/sprockets/sass_compressor.rb:30:in `call'
       /tmp/build_d9d0bde2/vendor/bundle/ruby/3.0.0/gems/sprockets-4.0.2/lib/sprockets/processor_utils.rb:84:in `call_processor'

我使用rails new project_name -j esbuild --css tailwind创建了这个项目。开发模式工作正常，只是生产部署。
我真的不知道从哪里开始调试这个。

ruby-on-rails

来源：https://stackoverflow.com/questions/70401077/rails-7-asset-pipeline-sasscsyntaxerror-with-tailwind

5条答案

按热度按时间

pkbketx91#

防止sasssc-rails设置sass作为压缩机固定它给我。
将其添加到application.rb
config.assets.css_compressor = nil

赞(0）回复(0）举报 12个月前

ar7v8xwq2#

来自rails tailwind自述文件
Tailwind使用现代CSS功能，这些功能不被默认包含在Rails 6的Gemfile中的sasssc-rails扩展所识别。为了避免任何类似SassC：：SyntaxError的错误，您必须从Gemfile中删除该gem。
https://github.com/rails/tailwindcss-rails

赞(0）回复(0）举报 12个月前

xytpbqjk3#

与Vincent的答案类似，我把config.assets.css_compressor = nil放在config/environments/production.rb中。把它放在application.rb中不起作用。
我还安装了sassc-rails gem

赞(0）回复(0）举报 12个月前

fruv7luv4#

Tomca32的答案解释了为什么我们会得到错误
然而，我需要做一些事情，因为我仍然需要处理Sass/Scss，不能只是删除sassc-rails gem，我需要替换它。
我正在运行cssbundling-rails和esbuild，以便使用Tailwind。
我的答案来自跑步：

bundle remove sassc-rails
rails css:install:sass

然后更新我的package.json以包括sass和tailwind命令。我通过将添加的sass命令和&&前置到现有的tailwind命令来做到这一点：

"scripts": {
    "build:css": "sass ... && tailwindcss ...",
    "build": "node ./esbuild.config.js"
  }

我还需要清理我的layout/application.html中从build命令添加的额外<%= stylesheet_link_tag "application" %>，然后我的错误就被清除了。

赞(0）回复(0）举报 12个月前

szqfcxe25#

选择的答案对我来说不是解决方案。使用dartsass-rails和manifest.js，其中包含以下内容：

//= link_directory ../stylesheets .css
//= link_tree ../builds

与builds目录中的application.*css产生冲突，可能在您的stylesheets中
我不得不将所有的sass文件移动到它们自己的目录中来真正解决这个问题，并创建了一个app/assets/sass目录，然后必须这样做：

# config/initializers/dartsass.rb 
Rails.application.config.dartsass.builds = {
  "../sass/application.scss"                 => "application.css",
  # other files in ../sass
}

赞(0）回复(0）举报 12个月前

我来回答

ruby-on-rails Rails 7资产管道SassC：：SyntaxError with Tailwind

5条答案

相关问题

热门标签

最新问答