为 Rails API 放置 CSS 样式表



我现有的项目是在Ruby on Rails api下构建的, 创建者:

rails new my_apps --api

这意味着应用程序下完全没有资产文件夹,也没有UI。

但是,根据当前的需求,我必须为此现有轨道添加一些页面(例如:为我的 API 构建 Wiki(。

问题是,如何将样式表文件夹以及 css 文件添加到我当前的项目中,以便我可以使用以下内容:

<%= stylesheet_link_tag 'mycss' %>

编辑:

有关更多信息,我们使用 2 个 gemreact-railswebpacker来设置反应前端。安装后,javascript将安装在app/javascript/packs

这是默认的webpacker.yml文件:

default: &default
source_path: app/javascript
source_entry_path: packs
public_output_path: packs
cache_path: tmp/cache/webpacker
# Additional paths webpack should lookup modules
# ['app/assets', 'engine/foo/app/assets']
resolved_paths: []
# Reload manifest.json on all requests so we reload latest compiled packs
cache_manifest: false
extensions:
- .jsx
- .js
- .sass
- .scss
- .css
- .module.sass
- .module.scss
- .module.css
- .png
- .svg
- .gif
- .jpeg
- .jpg

由于"rails new my_apps --api"是唯一的API rails应用程序创建命令。它不会为所有环境创建任何默认资产配置。当我们尝试自定义它时。管理所有东西将是一项繁琐的任务。 为了避免这种情况,下面提到了一个解决方案:

在任何 application_controller.rb 中设置布局方法,如下所示:

class ApplicationController < ActionController::Base
layout 'application'

创建样式.css到/public/assets/stylesheet/目录中。

h1{
color: red;
}

将应用程序.html.erb布局文件创建到app/views/layout/目录中。

<!DOCTYPE html>
<html>
<head>
<title>Demo App</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<%= stylesheet_link_tag '/assets/stylesheet/style.css', media: 'all'%>
</head>
<body>
<h1>Hellow World</h1>
<%= yield %>
</body>
</html>

最新更新