EC-CUBEのPCのCSSをgulpを使ってminifyする。
サーバー:さくらVPS
OS:CentOS
初期インストール状態でGoogleのPageSpeed Insights結果
Consider Fixing:のMinify CSSをgulpを使って修正したいと思います。
まずはサーバーのECCUBEをインストールしたディレクトリへ
$ cd /var/www/html/eccube/
gulpをインストールします
$ npm install gulp
gulpのminify用のプラグインをインストール
$ npm install gulp-minify-css
gulpfile.jsに下記内容を記載して/var/www/html/eccube/へアップロード
gulpを実行
$ gulp
html/user_data/packages/default/minifycss/にminifyされたcssが出力されます
EC CUBEのimport.cssをminifyされたcssを読み込むように変更
html/user_data/packages/default/css/
変更前
変更後
修正後読み込むと、1点上がっています。
Minify CSSの項目が残っていますが、こちらはjqueryのcolorbox.cssなので今回はこれでOKです。