rails」タグアーカイブ

Rails 5.2.0 + React + css

Rails 5.2.0(Rails 5.1以降)でReactを使う上でwebpackerによるcssの読み込みのメモ

参考の補足程度(config/webpack/environment.jsを触る必要なかった)

  • 作成するcssは拡張子.cssでも.scssでもよさそう(.cssでOKだった)
  • 作成する場所はapp/javascript/packsでなくてよい(app/javascript/stylesheetsに作成してOKだった)
  • 作成するcssのファイル名は.module.cssにする(参考リンク先のようにhello-react.module.sassなどとする)
  • 利用したいjsxでimportする(親子jsxどこでも気にせずimportする)
  • 呼び出すhaml, erbでstylesheet_pack_tagを記述するが、この時親jsxを指定する(stylesheet_pack_tagを記述しないと読み込まれない)

これで実際に読み込まれたhtmlソースを見るとcss-loaderを使った時のように「class=”unQ5pyAarpPHnB5enco5W“」となっており、スタイルが適用されていることも確認出来る。

association先もシリアライズする

Railsでmodelを利用する際にassociation先もシリアライズしたい場合の方法メモ

class CodeMaster < ApplicationRecord
  has_many :code_values

  def as_json options = {}
    super include: :code_values
  end
end
class ApplicationController < ActionController::Base
  protect_from_forgery with: :exception
  before_action :get_menus

  def get_codes
    @codes = CodeMaster.all
  end
end

「as_json」を使ってシリアライズ化する際にassociation先も含める
ただ、親レコード件数文selectが走るので使いどころに注意かも?

seed_fuでidが無いモデルへのデータ投入

Railsでseed_fuを使っている場合にidを削除したモデル(関連テーブルなど)へのデータ投入方法メモ

role_user = CSV.read("db/fixtures/#{Rails.env}/role_user.csv")

role_user.each_with_index do |r, i|
  next if i === 0

  role_id = r[0]
  user_id = r[1]

  RoleUser.seed(:role_id, :user_id) do |s|
    s.role_id   = role_id
    s.user_id = user_id
  end
end

ロールとユーザの関連テーブル(RoleUser role_id:integer user_id:integer)に投入する場合は複合キーを指定する(レコードが一意になる組合せ)

react-railsでimport

せっかくrailsでもreactでcomponent化しているのに再利用したい。

ということでreact-railsを使っている場合に他のcomponentをimportする方法のメモ。

//= require ./components/SubComponent
class MainComponent extends React.Component {
  constructor(props) {
    super(props)
  }
}

相対パスで指定。拡張子「.jsx」は省略して大丈夫でした。

rails newでChecksumエラー

Ruby on Railsで新規アプリケーションを作成 “rails new <app>” を実行した時に以下のエラーになった場合の対処です。

Checksum of /versions does not match the checksum provided by server! Something is wrong.

環境は以下の通り。

Windows 10 (64bit)
Ruby:2.2.4 (64bit)
DevKit:4.7.2 (64bit)
node.js:4.4.2 (64bit)

続きを読む