GREEを 支えるSassのしくみ CSS Nite LP, Disk26 CSS Preprocessor Shootout 2013/1/12 グリー 株 式 会 社 開 発 本 部 山 田 あかね
Agenda
Agenda
はじめに GREE Platformの 課 題
なぜSassなのか
課 題 を 解 決 するために Sassが 支えてきたこと
Sassが 支えてきたこと 1. 開 発 効 率率率
Sassが 支えてきたこと 1. 開 発 効 率率率 UP
Sassが 支えてきたこと 2. コード 品 質
.button.block.button.primary.block
Sassが 支えてきたこと 3. ページ 表 示 高 速 化
// components /* */ @import./partial/component/component_table ; /* */ @import./partial/component/component_table_flat ; /* */ //@import./partial/component/component_table_round ; //
registration.css CSS Sass registration.scss core.css CSS Sass core.scss
/* Sass webkit Sass */ @import./partial/vender/webkit ; /* Compass */ $experimental-support-for-mozilla: false; $experimental-support-for-webkit: true; $official: true;
# CSS css_dir = (environment == :production)? "css" : "css_debug # output_style = (environment == :production)? :compressed : :expanded #!/bin/bash compass compile e production compass compile
おわりに
ありがとうございました Twitter @purprin Facebook http://facebook.com/purprin purprin@gmail.com