ラック
Home > ブログ > 記事 > 2018年6月 > Roboで自動化(失敗)

Roboで自動化(失敗)

カテゴリ: 開発環境

JSのGulpのように、PHPにおけるタスクランナーとして「Robo」というものがあります。できることも

  • Scss→cssのコンパイル
  • css、jsのminify
  • 画像の圧縮
  • 上書き保存などの監視
  • Gulpの起動(!)>参考: Gulp Tasks – Robo

といった具合に、Gulpと同じようなことができるようです。私は去年のPHPカンファレンス2017で知ったのですが、これを使ってみようと思い立ったので試しました。

しかし、XAMPPが入っているWindows PCで試したのですが、Scss→cssのコンパイルが上手く行かずにコメント除去だけ処理していたり、Scssコンパイル後にminifyを走らせるとエラー出力したり、とどうもうまく動かせなかったので現時点では断念……。

  • BootstrapはComposerのリポジトリであるPackagistにはあるものの、日本語対応のテーマであるHonokaはPackagistにはない。そこでGithubのリポジトリを読み込むにはプロジェクトにcomposer.jsonがないとダメらしい。そこで、もし使うとすればHonokaをForkして自分でcomposer.jsonを用意する、ということになりそう。作るのは良いですが、後々のメンテが大変そう……
  • 他諸々パッケージを使うときにnpmほど物量がない
  • 現状上手く動いていないRoboのタスクを作るコスト。また、Roboがあまり浸透していなさそうで情報がない……

といった点を考えると「現状のGulpで良くない?」となってしまったのでした(とはいえ、PHP対応ができていないのでGulpを使う場合はそのことを考えないといけないのですが)。

次はもう少しじっくりサンプルとかを探してチャレンジできれば、と思います。

今回のコード

compose.json


{
    "name": "test/robotest",
    "require": {
        "leafo/scssphp": "^0.7.6",
        "natxet/CssMin": "^3.0.6",
        "consolidation/robo": "^1.3.0",
        "henrikbjorn/lurker": "^1.2.0",
        "twitter/bootstrap": "^4.1.1",
        "fortawesome/font-awesome": "^4.7.0"
    }
}

RoboFile.php


<?php
include(__DIR__ . '/vendor/autoload.php');

class RoboFile extends \Robo\Tasks {
    /**
     * メンバ
     */
    private $devDir;
//    private $commonVar;
//    private $variables;
    /**
     * コンストラクタ
     */
    public function __construct() {
        $this->devDir = [
//            'data' => [
//                'commonVar' => './src/data/commonvar.json',
//                'variables' => './src/data/variables.json'
//            ],
            'src' => [
                'src' => './src/',
                'php' => './src/php/',
                'scss' => './src/scss/',
                'js' => './src/js/',
                'img' => './src/img/',
                'concat' => './src/concat/'
            ],
            'dist' => [
                'dist' => './dist/',
                'css' => './dist/css/',
                'js' => './dist/js/',
                'img' => './dist/img/'
            ]
        ];
//        jsonRead($this->devDir['data']['commonVar'], $this->commonVar);
//        jsonRead($this->devDir['data']['variables'], $this->variables);
    }
    /**
     * json読み込み
     */
//    public function jsonRead($jsonUrl, $data) {
//        if(file_exists($jsonUrl)) {
//            $json = file_get_contents($jsonUrl);
//            $json = mb_convert_encoding($json, 'UTF8', 'ASCII,JIS,UTF-8,EUC-JP,SJIS-WIN');
//            $data = json_decode($json, true);
//        }
//    }
    /**
     * ディレクトリ作成
     */
    public function makedir() {
        $directoryArray = [
            $this->devDir['src']['concat'],
            $this->devDir['src']['concat'] . 'css/',
            $this->devDir['src']['concat'] . 'js/',
            $this->devDir['dist']['dist'],
            $this->devDir['dist']['css'],
            $this->devDir['dist']['js'],
            $this->devDir['dist']['img']
        ];
        foreach ($directoryArray as $id => $directory) {
            if(!file_exists($directory)) {
                mkdir($directory);
            }
        }
    }
    public function initdir() {
        $this->makedir();
    }
    /**
     * SCSSコンパイル
     */
    public function scss() {
      $this->taskScss([
        $this->devDir['src']['scss'] . 'index.scss' => $this->devDir['src']['concat'] . 'css/index.css'
      ])
           ->run();
    }
    /**
     * CSS結合(JSでも可能)
     */
    public function concat() {
      $this->taskConcat([
        $this->devDir['src']['js'] . 'lib/bootstrap.js',
        $this->devDir['src']['js'] . 'lib/jquery.js'
      ])
           ->to($this->devDir['src']['concat'] . 'js/lib.js')
           ->run();
    }
    /**
     * CSSのMinity
     */
    public function cssminify() {
      $this->taskMinify($this->devDir['src']['concat'] . 'css/index.css')
          ->to($this->devDir['dist']['css'] . 'index.css')
          ->run();
    }
    /**
     * JSのMinity
     */
    public function jsminify() {
      $this->taskMinify($this->devDir['src']['concat'] . 'js/lib.js')
          ->to($this->devDir['dist']['js'] . 'lib.min.js')
          ->run();
    }
    /**
     * 画像圧縮
     */
    public function minifyimg() {
      $this->taskImageMinify($this->devDir['src']['img'])
           ->to($this->devDir['dist']['img'])
           ->run(); 
    }
    /**
     * ファイルコピー
     */
    public function phpcopy() {
      $this->taskCopyDir([
             $this->devDir['src']['php'] => $this->devDir['dist']
        ])
           ->run();
    }
    /**
     * ファイル監視(管理画面) css
     */
    public function csswatch() {
      $this->taskWatch()
         ->monitor([
          $this->devDir['src']['scss']
        ], function () {
           $this->scss()->cssminify();
         } )
         ->run();
    }
    /**
     * ファイル監視(管理画面) js
     */
    public function jswatch() {
      $this->taskWatch()
         ->monitor([
          $this->devDir['src']['js']
        ], function () {
           $this->concat()->jsminify();
         } )
         ->run();
    }
    /**
     * ファイル監視(管理画面) img
     */
    public function imgwatch() {
      $this->taskWatch()
         ->monitor([
          $this->devDir['src']['img']
        ], function () {
           $this->minifyimg();
         } )
         ->run();
    }
    /**
     * まとめて実行
     */
    public function all() {
      $this->csswatch();
      $this->jswatch();
      $this->imgwatch();
    }
}

コマンド(実行イメージ)


$ composer require

## 略

$ ./vendor/bin/robo initdir

## 必要なディレクトリを作成。初期化作業

$ ./vendor/bin/robo all

## ファイル監視開始

こんな感じで上手く行けば良いなー、と思っていたのですが。

参考

タグ: php

 



関連する記事一覧