无法从 Rails 应用程序中的 JS 访问 CSS

Posted 2023-05-09

【中文标题】无法从 Rails 应用程序中的 JS 访问 CSS

【英文标题】：Cannot access CSS from JS in Rails app

【发布时间】：2016-02-18 08:37:30

【问题描述】：

我有一个部分使用 WYSIhtml 的 Rails 应用程序。它是这样控制的：

// richtext
if($('.richtext').length) 
  var editor = new wysihtml5.Editor(document.querySelector('.richtext'), 
    toolbar: 'wysihtml5-toolbar',
    parserRules:  wysihtml5ParserRules,
    stylesheets: '/assets/wysihtml5-stylesheet.css'
  );

这在本地工作正常，但无法在远程找到 wysihtml5-stylesheet.css。我试过弄乱资产管道/预编译但没有运气。有什么想法吗？它似乎是最近发生的，即它以前工作过。除了我刚才提到的设置之外，没有任何设置被更改。

请帮忙。

更新

即使使用asset_path 也找不到该文件：

stylesheets: '<%= asset_path "wysihtml5-stylesheet.css" %>'

【问题讨论】：

在生产中，资产被编译并在文件名的末尾给出一个哈希值，这很可能是你看不到它的原因。查看api.rubyonrails.org/classes/ActionView/Helpers/… 的asset_path 方法

同样的问题，只是最后的MD5哈希，即找不到http://domain.com/assets/wysihtml5-stylesheet-9d0d93a7a284f16a3dea08a722430b272064c192b7c57a41329d7f86a8adb7da.css

嗯，您实际上不能直接设置 md5 哈希。您必须使用 rails 帮助程序来生成文件的链接或将文件直接添加到 public 文件夹下。

嗯，这很可能与您的资产在生产中的服务方式有关。搜索 Rails 4 的 serve_static_files 选项并修改它。

我投票决定将此问题作为离题结束，因为该问题是特定于环境的，与 Rails 无关。

【参考方案1】：

几乎可以肯定，问题在于您如何称呼您的stylesheet。

--

在生产中，Sprockets fingerprints 资产文件 - 向它们添加大型 md5 哈希 - 使用它们的“静态”名称引用它们是不正确的（它根本不起作用）。

解决此问题的方法是使用asset_path helpers 之一来调用文件（它将以“静态”形式或“指纹”形式引用文件）。

你已经这样做了，但我认为你需要add .erb to your JS file 才能让它工作：

#app/assets/javascripts/application.js.erb
if($('.richtext').length) 
  var editor = new wysihtml5.Editor(document.querySelector('.richtext'), 
    toolbar: 'wysihtml5-toolbar',
    parserRules:  wysihtml5ParserRules,
    stylesheets: "<%=j asset_path('wysihtml5-stylesheet.css') %>"
  );

【讨论】：

感谢您的建议，但是，.erb 已添加到 JS 文件中。