aboutを閉じる
このブログについて

今はPSO2とかアズールレーンとかをプレイしている人です。
内容は日記ですよ。

■メインでやってるゲーム
PSO2
アズールレーン

■PSO2
5鯖で開始し、現在は9鯖で遊んでる。
最近はSuがボロボロなのでポリタンランドをのびのびやってるぐらい。
メイン職はSu、今はHe。

■アズールレーン
10月上旬に開始。
のんびりプレイでのびのび育成中。
このまま暫くイベント来ないままでいてほしい。

GulpとかNode.jsとか、結局よくわからん

GulpくんとNode.jsくん

ひぇぇ

お久しぶりの更新です。
ここ二日間か三日間ほど忙しくて更新できませんでした。
終電チャレンジをする身になるなんて聞いてねえ。

今回の業務で使うことになったんですよ、Gulpとかを。
噂には聞いてたんですけど、色々と便利だと。
個人でイチから自分でやるには勉強コストが掛かるのでやってませんでした。
誰か環境構築してくれよっていう。

そのあたり、既に用意されたものを教えてもらいながらやったので超らくちんちん。
なんとかかんとか使えたのですけど、思った以上に色々楽ですね。
触った以上のことが当然できるはずですが、どれがどれの機能なのかよくわかってません。
今回使ったのは、

・foundation 多分CSSのフレームワーク
・Node.js よくわかんないけどなんか統括するやつ
・Gulp よくわかんねえけどすごいやつ
・Bower インストールされてる理由がわからない

ぐらいですかね。

それを本日自宅でも環境構築してたんですけども。
多分流れとしては、

Node.jsでGulpとかBowerとかfoundationとかをインストールする
foundationでCSSフレームワーク駆使して、監視しながら更新する
GulpがSassをコンパイルしてくれたりする
更新確認できたものをGitに上げてバージョン管理

みたいな感じですかね。
特にすごいと思ったのは以下の感じで。

・foundationのフレームワークとして能力
Gridを主な機能としているCSSの拡張?
わざわざ.spでdisplay:noneとかしなくても、show-for-largeとかで隠せる
色々すごいけど、なんか色々競合して大変なことになった
おかげさまで午前2時半まで仕事してました。

・watch機能
多分これは今回foundationの機能で、更新を監視してくれる
つまりは、

Sassを上書き
distフォルダにSassをコンパイルしたCSSが配置される
ブラウザを自動更新して、上書きしたCSSが確認できる
ちなみにHTMLとかimgも同じ要領で自動更新してくれる

っていうらしく、常に監視してくれるのが最高に便利
どうやらGulpにもgulp-watchがあるみたいだけど、色々入れたりする必要があって面倒
foundationなら監視から更新までをgulpの機能拡張してなんとかしてくれるっぽい?
正直その辺は曖昧
使えりゃいいんだよ

・上記機能とgitの合せ技が強い
元々gitはバージョン管理システムとしてめっちゃ便利
でもfoundation使えば色々効率化できて余計に便利に感じる
しかし習得までのコストが掛かるから効率ダウン
慣れりゃ話は別

ってところですかね。
特に感動したのはwatch機能でしょうか。
異常なぐらい便利、わざわざブラウザを更新せずに済む。
デメリットもありますけど、面倒なので書きません。

んで、本格的にSassも弄ったんですけど、こっちも便利ですね。
今後はちゃんとSassを利用していきたいと思います。
多分。

自宅で構築してみる

そんで、今日は同じような環境を構築することにしました。
思い出したかのように。
ハマった部分を羅列します。

・必要なもんがどれかわかんねえ
仕方ないのでGulp、foundation、bowerらへんをインストール
これで合ってるかどうかは知らない

・watchが機能しねえ
なぜかstart defaultで止まる
これはテンプレートをベーシックにすると起こるっぽい
同じことになってる人多数

gulp hangs indefinitely after ‘default’
https://github.com/zurb/foundation-sites/issues/8681
要約すると、「Gulpのwatchが’default’でハングする!しかも無期限!」ってこと
解決していない。

そこで、そもそもdefaultな生成をするテンプレートが悪いのでは?と予測

【触ってみたよ】Foundation 6は『Panini』がキモだ!【CSSフレームワーク初心者】

【触ってみたよ】Foundation 6は『Panini』がキモだ!【CSSフレームワーク初心者】

ここで紹介されている「$ foundation new –framework sites –template zurb」を実行
そしたらwatchできましたっていう
多分defaultが関係している、かも

・失敗したnpmモジュール?を削除できない
テンプレート生成して、watchできないやつを消そうとしたら発生
どうやらパスが長すぎて限界突破している模様
「項目が見つかりません」とか出るので調べたらこんな記事が

Windows環境下でローカルインストールされたnpmモジュールを一括削除する

Windows環境下でローカルインストールされたnpmモジュールを一括削除する

この方のやり方によれば、「ネットワーク共有すればパスが短くなる、消せる」らしい
やってみたらパスが短くなって消せましたとさ
ちなみにできるフォルダとできないフォルダがあった
違いは知らん

・Sourcetreeがおかしい
起動しなかったりインストールできなかったりした
イベント監視で見てみたら.dllファイルが悪さをしていた模様
詳しいことは不明

仕方ないので全部消して、ローカルのuserにあるAtlassianも消して再インストール
現状なんとか見れている様子
その内またなったらなんとかする
最悪別のgitソフトを利用することになるかも?
タートルだっけ

こんなところですかね。
結構ハマりにハマって時間を取られました。
とはいえ、(多分)なんとか構築はできるかと。
これ以上に問題が発生したら今日は諦めます。
明日の自分がなんとかする。

もしも上手くこれでHTML生成できたりできれば、色々と快適になりそう。
特にSassの自動コンパイルは非常に嬉しいのでぜひ取り入れたい箇所。
watchでの監視も魅力的なんですけどねー。

それでは今日はここらでサヨウナラー

コメントを残す

page-top