-
ID:5WqcMK さんの質問

まだSassを導入できていないんです。
導入したほうがいいですよね・・・。
Stylusとかも。どれを勉強するか悩みます。
サイトの規模に寄るんですかね。

cssメタ言語~!

みんなの回答 6 件

ID:ETy0lO さんの回答

Sass使うともう戻れないですね。
でもチームが、とか取引先がSass入ってないと厄介ですね。相手がcss修正してくれても自分でSassに反映させなきゃなんで、でも結局みんなで使えばいいと思うので入れましょう。ターミナル苦手ですが導入はLIGの記事とか見ながらなんとかできました。爆速になるので空いた時間で新たな知識も身につけられますよー

ID:WEV3yM

は!この方にレスするの忘れてました。トピ主です。有難うございます。LIGの記事も拝見しましたー!爆速になるからこれからのために身につけたーい!

ID:j67/fw さんの回答

ほうら俺のcompassをSASSってくれよ

ID:K29s8L

expandedしてたの?minified かと思った…

ID:5WqcMK

上手ですよね!

ID:5WqcMK さんの回答

ヨシ!導入頑張ろうかな!有難うございます!
//liginc.co.jp/designer/archives/11623

ID:5WqcMK

ちなみに・・・ほとんどは既に導入済みってことですかね?

ID:rSx4L/ さんの回答

今はもう2017年だ
Compassを使う奴なんてもういない

//qiita.com/youthkee/items/f456fb5730655cc8f9c2

ID:5WqcMK

有難うございます!ひとまず ruby と Sassはいれて、どうしようとしてたところでした

ID:5WqcMK

ひゃー全然わかりません。

ID:5WqcMK

//qiita.com/nabeliwo/items/0aeea21e95f3fbab3955
こっちってことかな

ID:zy578G

rubyを使ったやつも遅れてんぞ。
フロントエンドツールはnode.js使ったものが多いし、今からSassを使うならnode-sass経由のlibsassだな。
.
そんでもってコメ主のリンク先に書いてあるように、PostCSS(プリプロセッサじゃなくポストプロセッサ)が今後の主流になっていくと思われ。

ID:8gH9Qw

もう何言ってるかさっぱりわからない

ID:rSx4L/

簡単だよ
全てをgulpで管理すればいい

ID:5WqcMK

こういうことですかねー!
//celtislab.net/archives/20160302/node-sass-cl/
たしかにだいぶ前に顔だしてみたハンズオンとかもNode.jsでした!(わけわからずやりましたが)

gulpで管理はこういうのですかね?。゚(゚´Д`゚)゚。
//qiita.com/tonkotsuboy_com/items/564f9bb78d177483f83e

ID:rSx4L/

この辺りから始めた方がいいかな

//qiita.com/yoshinariiii/items/8340286ec6f3ed6ff888

ID:5WqcMK

コンパイルには時間がかかるから監視が必要ってことですかね!

ID:rSx4L/

その通り
cssが肥大化していけばコンパイルに時間がかかる

ID:5WqcMK

これに行き着くと!感動!
//w3q.jp/t/7902

ID:rSx4L/

↑2年前この質問投げてたのは私でした

ID:5WqcMK

そうなんですね!ご丁寧に有難うございました。
2年も何年も知識が遅れていて恥ずかしいかぎりです。。。

ID:zy578G

>コンパイルには時間がかかるから監視が必要
ってより、ファイルに変更があるたびに毎回手動でコンパイルのコマンドを打つのは大変だから、監視させる必要があるってこと。
とりあえずgulp入れときゃプラグイン揃ってるし、解説してる記事も多いから、初めてでもなんとかなるよ。

ID:5WqcMK

なるほど!有難うございます!やってみます!

ID:5WqcMK

Sass Node.js gulp でいけるかな

ID:ztnCa/

引っ掻き回すよ。
gulpはドキュメントがそろっているっていう意味では導入しやすいかもしれないが、どちらかと言えば、gulpは既に悪手(管理が煩雑)になってるよね。そもそもsass動かすためだけにgulpってとても非効率だよね。
導入としてもgulpという一枚岩をわざわざ勉強するのも非効率。
node(package.json)だけでできることをgulp挟む意味はもうない。

ID:5WqcMK

なんだってー!

ID:5WqcMK

これですか?
//qiita.com/sinmetal/items/395edf1d195382cfd8bc

ID:5WqcMK

いやん2013年のだった

ID:ztnCa/

これも2年前の記事だけど、2年前に既にこの知見だからね。
t32k.me/mol/log/npm-run-script/


  • sass(自動コンパイル・ブラウザ自動更新)動かすためにタスクランナーなんていらない。これで十分。
    qiita.com/micchyboy/items/0074f002d8f1663577a2
ID:bxLeNm

gulpが悪手ってのはこれかな
ttps://liginc.co.jp/334426

ID:zy578G

確かにビルドツールや最小限の開発環境さえあればいいのなら、npm runやwebpack等で充分だからzy578GcL26Aqが言ってることもわかるんだが、個人的にタスクランナーはまだ必要だな。
.
ビルドや開発環境のみならいいけど、style guideやicon font生成したり、ファイルのminifyコピー削除やと画像最適化もあわせてやりたいってのがある。
上記のタスクはどのプロジェクトでも利用するし、開発版・リリース版でタスクを切り分けるのも簡単。
.
だから最終的にはトピ主がどこまで実現したいかによると思われ。

ID:zy578G

自分のID書いてたwww
ztnCa/0e6Jhcね。

ID:.WwRQ0

もう2、3年もすればweb componentsが一般化してsassさえ必要なくなるよ

liginc.co.jp/web/html-css/html/58267

ID:ztnCa/

>:zy578GcL26Aq
おれの書き方も悪かったかもしれないけど、cssコンパイル(pre/post/watch/reload/)したいしただけにgulpは冗長というのがまず一点。次に、タスクラナーという意味なら、grunt/gulp/webpack/npm scriptsなど、すべてタスクランナーの一端があって、gulpじゃないとできないってことはほぼない。gulpの作業は他のツールでほぼ代替できると言える。その意味でweb制作全般でいうなら「タスクランナー」が必要というのは同意。


  • [style guideやicon font生成したり、ファイルのminifyコピー削除やと画像最適化もあわせてやりたいってのがある。]

  • このあたりもすべてwebpackだけで代替できるし、npm scriptsだけでも代替できる。もちろん、開発版・リリース版でタスクを切り分けるのも簡単。話がそれちゃってごめんね、トピ主。
ID:zy578G

>cssコンパイル(pre/post/watch/reload/)したいしただけにgulpは冗長というのがまず一点。
.
これはおれも同意。ただ結局webpackも似たようなもんだから、冗長と依存を避けるなら、実質的にnpm一択ってことだからなぁ。
つーか、webpackって今までビルドツールに特化してる印象があったんけど、割と色々できるようになってんだな。
icon font生成も出来るとか知らんかったわ。

ID:WEV3yM

トピ主です。わー有難うございます。
ちょっと使うだけなら
試しはnpm一択!ってことですかね!
これはタスクランナーではないんですかね?

たとえばこれかな
//qiita.com/micchyboy/items/0074f002d8f1663577a2

ID:ztnCa/

タスクランナーの定義なんてものはなくてだな、その場の文脈で感じるしかない。おれ的には複数のタスク管理できるものはすべてタスクランナーだと思うよ。みんながnpmをタスクランナーと呼ぶかどうかは別として、少なくともタスクを管理する機能がnpmにあるってこと。そのツールがタスクランナーかどうかなんて何も気にする必要がないよ。目的を達成できるかどうかだけみればいい。

ID:lgb2SH

開発環境なんて大して大切じゃないさ。
俺は昔はひどい開発環境で、あの頃は何もなくて。。それだって楽しくやったよ?

ID:5WqcMK

いまでも楽しいのですが、知識や技術的になくてやってない事実が嫌でして・・・今後こんなこともできていない自分に焦るのです。

ID:lgb2SH

プログラマーは技術なんていらないんだよ。あのエディタがいい、あのフレームワークがいい、あのソフトウェアがいいなんて細かいこと言ってたら楽しめないよ。それよりも楽しむことが大切だよ。細かい技術の話ばかりしてるから日本人プログラマーのレベルはずっと下がりっぱなしなんだ。他の国にどんどん追い抜かれちゃってる。理由は楽しんでないからさ。ザッカーバーグやビルゲイツやジョンカーマックがそんな細かい退屈な話をしたと思うかい?彼らは楽しんでたんだよ。俺だってあの頃は何もなくて。。それだって楽しくやったよ?必要なのは才能だけさ、他には何もいらないんだ。もっとワクワクすることを考えよう。あとは勝手についてくるからさ。楽しんでね!

ID:5WqcMK

楽しむ!そっかー。あんまり焦らず楽しみます!

ID:vd6.zo さんの回答

SassがどうこうよりCSSの使い方をどうするかですね。
サイト作るたびに、行き当たりばったりでコーディングするなら必要ないでしょう。
でも、OOCSSとかCSSをモジュール化して利用していきたいのなら、Sassを使ってCSSを上手く管理するのが大事だと思います。
まずは命名規則をどうするか決めることからはじめてはいかがでしょうか。

ID:5WqcMK

そうですよね。ただ、これからのために勉強しときたい、触っときたいという思いがあって・・・

ID:5WqcMK

制作会社ではないので、そんな大規模なcssは触ることはないんですよね。でも今後CSSの管理や作業効率化のため、頑張ってみます!

ID:ztnCa/

もっともな意見ではあるけれど、variables/import/extends/placeholderあたりの機能使うだけで、sassを利用する意味あると思うけどね。

ID:5WqcMK

そうですよね。そうなんです。作業効率をあげたい!

ID:5WqcMK

あれ variables/import/extends/placeholder は作業効率とかの問題じゃないですかね?

ID:rSx4L/

variables/import/extends/placeholder
この辺りを使いこなせれば必ず作業効率は上がるはず

OOCSSを覚えればcssの肥大化を防ぐ事も出来る

ID:5WqcMK

なるほど。調べてまずはそこからですね。
OOCSSは今でもできてるかな~と♪(bootstrapから作ることが多いから?)

ID:g/4SoR さんの回答

gulpはオワコン
はっきりわかんだね

ID:5WqcMK

まじですか

ID:5WqcMK

これとかですかね?
//qiita.com/buchiya4th/items/01b4ad050b7c59b48539

最終更新日:2017-04-02 (8,044 views)

関連するトピックス

ページ上部に戻る