Submit Search
ES2015をRailsアプリに導入しようとして思わぬ闇にハマった話
0 likes
•
1,115 views
N
Nobuhito Ibaraki
2016/09/20 Fashion Tech meetup #3 LT資料
Engineering
Read more
1 of 19
Download now
Download to read offline
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
More Related Content
PDF
Flexbox しか勝たん
Tomoe Sawai
PDF
Firebase Authを Nuxt + Railsの自前サービス に導入してみた
Tomoe Sawai
PPTX
Web開発初心者がReactをチームに導入して半年経った
kazuki matsumura
PDF
ASP.NET WEB API 開発体験
miso- soup3
PPTX
【2017早めの夏休み自由研究】SPAとサーバーレスについて
kazuki matsumura
PDF
Vsugday2012 winter lt_sakai
Tatsuaki Sakai
PPTX
JAWS DAYS 2017直前! AWS総復習
Masanori Hayashi
PDF
AWS+WordPressでつくるFirefoxアプリ
Takayuki Miyauchi
Flexbox しか勝たん
Tomoe Sawai
Firebase Authを Nuxt + Railsの自前サービス に導入してみた
Tomoe Sawai
Web開発初心者がReactをチームに導入して半年経った
kazuki matsumura
ASP.NET WEB API 開発体験
miso- soup3
【2017早めの夏休み自由研究】SPAとサーバーレスについて
kazuki matsumura
Vsugday2012 winter lt_sakai
Tatsuaki Sakai
JAWS DAYS 2017直前! AWS総復習
Masanori Hayashi
AWS+WordPressでつくるFirefoxアプリ
Takayuki Miyauchi
What's hot
(10)
PPTX
Amazon CloudFrontで始めるお手軽簡単CDN
Classmethod,Inc.
PPTX
入社100日の新人がクラスメソッドでの激速の日々を赤裸々に語る
Classmethod,Inc.
PPTX
本番運用で使うVisual Studio
Kazuyuki Miyake
PPTX
VUIアプリ(Alexaスキル)の苦悩、自動テストをGoogle Homeが解決してくれる?
Atsushi Umakatsu
PPTX
2016/12/17 ASP.NET フロントエンドタスク入門
miso- soup3
PDF
WordPress JSON REST API 〜さらばPHP、さらばWordPressテーマ
Kazue Igarashi
PDF
2016/05/01 Visual Studio with Cordova
miso- soup3
PDF
WP-APIを使ってみよう&No PHPテーマという考え方
Hidetaka Okamoto
PPTX
XamarinでAzure AD認証 (リフレッシュトークン対応)
Kazuyuki Miyake
PDF
Titanium もくもく会 #4
Kosuke Isobe
Amazon CloudFrontで始めるお手軽簡単CDN
Classmethod,Inc.
入社100日の新人がクラスメソッドでの激速の日々を赤裸々に語る
Classmethod,Inc.
本番運用で使うVisual Studio
Kazuyuki Miyake
VUIアプリ(Alexaスキル)の苦悩、自動テストをGoogle Homeが解決してくれる?
Atsushi Umakatsu
2016/12/17 ASP.NET フロントエンドタスク入門
miso- soup3
WordPress JSON REST API 〜さらばPHP、さらばWordPressテーマ
Kazue Igarashi
2016/05/01 Visual Studio with Cordova
miso- soup3
WP-APIを使ってみよう&No PHPテーマという考え方
Hidetaka Okamoto
XamarinでAzure AD認証 (リフレッシュトークン対応)
Kazuyuki Miyake
Titanium もくもく会 #4
Kosuke Isobe
Ad
ES2015をRailsアプリに導入しようとして思わぬ闇にハマった話
1.
ES2015をRailsアプリに導入しようとして 思わぬ闇にハマった話
2.
名前: 茨木暢仁 担当業務: iQONのWebページの改修、メンテナンス 自己紹介 略歴: 大学時代は材料力学の研究に従事しながら Webアプリケーションの開発も行う 2016年、株式会社VASILYに新卒で入社
3.
iQONの環境 Ruby on Rails 4.1.0 CoffeeScript Sass JavaScript,CSSのコンパイルにはasset pipelineを使用
4.
iQONでもES2015を書きたい
5.
どうやるか? browserify‑rails + browserify + babel sprocketsを経由でフィンガープリント付与や 自動コンパイルが可能 babelなどのNode.jsのトランスパイラを利用できる
6.
試しに開発環境に導入
7.
自動コンパイルが正しく動作しない importされたファイルを変更しても、読み込み元のファイルがコ ンパイルされない。
8.
いろいろ試してみるが正しく動かない 同様の問題がGitHubのissueにあげられていたので browserify‑railsを修正済みのバージョンに上げてみる bundle exec rake
assets:clobber で コンパイル済みのアセットをすべて削除
9.
闇1 app/assets => ../public (シンボリックリンク)
10.
一般的なRailsアプリ RAILS̲ROOT/ ├ app/ │ ├ assets/ │ │ ├ javascripts/ │ │ └ stylesheets/
11.
iQON RAILS̲ROOT/ ├ app/ │ ├ assets => ../public シンボリックリンク(!) │ ├ public/ │ ├ javascripts/ │ └ stylesheets/ 後からアセットパイプラインを導入する際に アセットのディレクトリ移動なしで アセットパイプラインを導入するための闇実装
12.
開発環境でアセットを本来あるべき app/assets/以下に移動 特定のJavaScriptファイルの存在を 確認するテストも併せて改修 #coding: utf-8 require 'spec_helper' require
'rails_helper' #Ensure that all javascript files are working feature "Javascript files" do scenario "are all active" do js_files = YAML.load_file("#{Rails.root}/lib/js_file_list.yml") js_files.each do | path | expect(File).to exist("#{Rails.root}/public/javascripts/#{path}") end end end
13.
これによりが正常に動作したので解決!
14.
闇2 意図がまったく伝わらないコメント
15.
開発環境での動作検証&テスト通過 いざデプロイ!
16.
大事故発生...
17.
public/javascripts以下に他社用のJavaScriptが混在 app/assets/javascripts/以下にJavaScriptファイルを移動したことで 他社用ファイルが404になり、大事故になってしまった。
18.
さっきのテストは他社用JavaScriptのテストだった Ensure that all javascript files are workingを意図がわかる コメントに書き換え #coding: utf-8 require 'spec_helper' require
'rails_helper' #Ensure that all javascript files are working feature "Javascript files" do scenario "are all active" do js_files = YAML.load_file("#{Rails.root}/lib/js_file_list.yml") js_files.each do | path | expect(File).to exist("#{Rails.root}/public/javascripts/#{path}") end end end
19.
まとめ シンボリックリンクをディレクトリ移動の 代わりに用いるのは事故の元 コメントを意図が伝わるように書くのは大事 新技術の導入はハマることも多いが 改善のきっかけになる!
Download