Ruby on Rails CSS不通过资产管道加载

时间:2023-01-16 16:10:46

I have searched the web for a solution to this problem and haven't found a solution that works albeit I did find similar problems.

我在网上搜索了这个问题的解决方案,并没有找到一个有效的解决方案,虽然我确实发现了类似的问题。

So, I am new to RoR development and this is my first app. I am try to create a page and have so far managed to route to my first page using a controller with an action. The routing works fine.

所以,我是RoR开发的新手,这是我的第一个应用程序。我尝试创建一个页面,到目前为止设法使用带有操作的控制器路由到我的第一页。路由工作正常。

The problem is with the CSS, I have placed the css in a separate .css file within assets/stylesheets/main.css.

问题出在CSS上,我把css放在assets / stylesheets / main.css中的一个单独的.css文件中。

Here it is:

这里是:

h1 {
   font-size: 100px;
}

I link to all stylesheets using the default method provided by Rails, it is placed in my application.html.erb file like so:

我使用Rails提供的默认方法链接到所有样式表,它放在我的application.html.erb文件中,如下所示:

.
.
.
    <%= csrf_meta_tags %>
    <%= stylesheet_link_tag 'default', media: 'all', 'data-turbolinks-track': 'reload' %>
.
.
.

From my research, I have learnt that the assets pipeline allows you to place all of your CSS in the assets/stylesheet directory (and JS in the JS directory etc.). Rails should then use these CSS files automatically.

根据我的研究,我了解到资产管道允许您将所有CSS放在assets / stylesheet目录中(以及JS目录中的JS等)。然后Rails应该自动使用这些CSS文件。

But this isn't working for me as the index.html.erb file stays the same as it would without the main.css when I run the app.

但这对我不起作用,因为当我运行应用程序时,index.html.erb文件保持与没有main.css的情况相同。

Any help would be appreciated.

任何帮助,将不胜感激。

Let me know if you require further information.

如果您需要更多信息,请与我们联系。

Thank you.

谢谢。

P.S. Using Rails 5.0.5 and ruby 2.2.6p396 (2016-11-15 revision 56800) [i386-mingw32] on Windows 10

附:在Windows 10上使用Rails 5.0.5和ruby 2.2.6p396(2016-11-15修订版56800)[i386-mingw32]

P.P.S. I should note that <%= stylesheet_link_tag 'default', media: 'all', 'data-turbolinks-track': 'reload' %> was previously <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>. I had to use default as using application threw an exception (ExecJS::ProgramError)

P.P.S.我应该注意<%= stylesheet_link_tag'default',media:'all','data-turbolinks-track':'reload'%>以前是<%= stylesheet_link_tag'application',media:'all','data- turbolinks-track':'reload'%>。我不得不使用默认值,因为使用应用程序引发异常(ExecJS :: ProgramError)

2 个解决方案

#1


1  

Turns out that the problem was with the installation of Node.js.

事实证明问题出在Node.js的安装上。

  1. Visit https://nodejs.org/en/download/
  2. 访问https://nodejs.org/en/download/
  3. Download and install current version
  4. 下载并安装当前版本
  5. Restart computer after installation completes
  6. 安装完成后重新启动计算机
  7. Re run server, the problem should be gone and the app should run without any modifications. i.e. changing from application to default when specifying CSS files.
  8. 重新运行服务器,问题应该消失,应用程序应该运行而不做任何修改。即,在指定CSS文件时从应用程序更改为默认值。

Visit https://www.youtube.com/watch?v=l04kFL3pnEk for a step by step video tutorial.

访问https://www.youtube.com/watch?v=l04kFL3pnEk,了解分步视频教程。

#2


0  

stylesheet_link_tag(*sources)

Returns a stylesheet link tag for the sources specified as arguments. If you don't specify an extension, .css will be appended automatically. You can modify the link attributes by passing a hash as the last argument.
http://api.rubyonrails.org/classes/ActionView/Helpers/AssetTagHelper.html#method-i-stylesheet_link_tag

返回指定为参数的源的样式表链接标记。如果您未指定扩展名,则会自动附加.css。您可以通过传递哈希作为最后一个参数来修改链接属性。 http://api.rubyonrails.org/classes/ActionView/Helpers/AssetTagHelper.html#method-i-stylesheet_link_tag

To link to app/assets/stylesheets/main.css you need to use <%= stylesheet_link_tag 'main', media: 'all', 'data-turbolinks-track': 'reload' %>

要链接到app / assets / stylesheets / main.css,您需要使用<%= stylesheet_link_tag'main',media:'all','data-turbolinks-track':'reload'%>

#1


1  

Turns out that the problem was with the installation of Node.js.

事实证明问题出在Node.js的安装上。

  1. Visit https://nodejs.org/en/download/
  2. 访问https://nodejs.org/en/download/
  3. Download and install current version
  4. 下载并安装当前版本
  5. Restart computer after installation completes
  6. 安装完成后重新启动计算机
  7. Re run server, the problem should be gone and the app should run without any modifications. i.e. changing from application to default when specifying CSS files.
  8. 重新运行服务器,问题应该消失,应用程序应该运行而不做任何修改。即,在指定CSS文件时从应用程序更改为默认值。

Visit https://www.youtube.com/watch?v=l04kFL3pnEk for a step by step video tutorial.

访问https://www.youtube.com/watch?v=l04kFL3pnEk,了解分步视频教程。

#2


0  

stylesheet_link_tag(*sources)

Returns a stylesheet link tag for the sources specified as arguments. If you don't specify an extension, .css will be appended automatically. You can modify the link attributes by passing a hash as the last argument.
http://api.rubyonrails.org/classes/ActionView/Helpers/AssetTagHelper.html#method-i-stylesheet_link_tag

返回指定为参数的源的样式表链接标记。如果您未指定扩展名,则会自动附加.css。您可以通过传递哈希作为最后一个参数来修改链接属性。 http://api.rubyonrails.org/classes/ActionView/Helpers/AssetTagHelper.html#method-i-stylesheet_link_tag

To link to app/assets/stylesheets/main.css you need to use <%= stylesheet_link_tag 'main', media: 'all', 'data-turbolinks-track': 'reload' %>

要链接到app / assets / stylesheets / main.css,您需要使用<%= stylesheet_link_tag'main',media:'all','data-turbolinks-track':'reload'%>