自己満足なBLOG

Yii2のテンプレートをインストールしたら、そこにgulpをインストールする。
グローバルインストールは終わっているので、GitBashで確認。

$ gulp -v
[19:31:28] CLI version 3.9.0
カレントフォルダをテンプレートのフォルダに変更。

$ cd c:/xampp/htdocs/yii2-app-advanced
ローカルインストールが終わってないと、次のようにエラーとなる。

$ gulp
[25:19:04] Local gulp not found in ***
[25:19:04] Try running: npm install gulp
そして、gulpをローカルインストール。

$ npm install gulp
gulp@3.9.0 node_modulesgulp
├── pretty-hrtime@1.0.0
├── interpret@0.6.2
├── deprecated@0.0.1
├── archy@1.0.0
├── minimist@1.1.1
├── v8flags@2.0.7 (user-home@1.1.1)
├── tildify@1.1.0 (os-homedir@1.0.0)
├── chalk@1.0.0 (ansi-styles@2.0.1, escape-string-regexp@1.0.3, supports-color@1.3.1, strip-ansi@2.0.1, has-ansi@1.0.3)
├── semver@4.3.6
├── orchestrator@0.3.7 (stream-consume@0.1.0, sequencify@0.0.7, end-of-stream@0.1.5)
├── liftoff@2.1.0 (extend@2.0.1, rechoir@0.6.1, flagged-respawn@0.3.1, resolve@1.1.6, findup-sync@0.2.1)
├── gulp-util@3.0.5 (array-differ@1.0.0, array-uniq@1.0.2, object-assign@2.1.1, lodash._reescape@3.0.0, beeper@1.1.0, lodash._reinterpolate@3.0.0, lodash._reevaluate@3.0.0, replace-ext@0.0.1, vinyl@0.4.6, lodash.template@3.6.1, through2@0.6.5, multipipe@0.1.2, dateformat@1.0.11)
└── vinyl-fs@0.3.13 (graceful-fs@3.0.8, defaults@1.0.2, strip-bom@1.0.0, vinyl@0.4.6, mkdirp@0.5.1, through2@0.6.5, glob-stream@3.1.18, glob-watcher@0.0.6)
さて、再度gulp起動！

$ gulp
[25:27:29] No gulpfile found
そりゃあ、そうだ。
以下の内容のファイルを、gulpfile.jsとして、yii2-app-advancedフォルダに作って、

var gulp = require(‘gulp’);
gulp.task(‘default’, function() {
console.log(“Hello World!”);
});
再度、

$ gulp
[25:44:04] Using gulpfile c:xampphtdocsyii2-app-advancedgulpfile.js
[25:44:04] Starting ‘default’…
Hello World!
[25:44:04] Finished ‘default’ after 2.62 ms
よし！

Browsersyncは、いつになったら？

GitBashを起動して、カレントディレクトリをxamppのhtdocsに移動。

$ cd c:/xampp/htdocs
そして、yii2の上級テンプレートを作成。

$ composer create-project –prefer-dist yiisoft/yii2-app-advanced
Installing yiisoft/yii2-app-advanced (2.0.4)
  – Installing yiisoft/yii2-app-advanced (2.0.4)
    Downloading: 100%
Created project in C:xampphtdocsyii2-app-advanced
Loading composer repositories with package information
Installing dependencies (including require-dev)
  – Installing yiisoft/yii2-composer (2.0.3)
    Loading from cache
  – Installing ezyang/htmlpurifier (v4.6.0)
    Loading from cache
  – Installing cebe/markdown (1.1.0)
    Loading from cache
  – Installing bower-asset/jquery (2.1.4)
    Loading from cache
  – Installing bower-asset/jquery.inputmask (3.1.63)
    Loading from cache
  – Installing bower-asset/punycode (v1.3.2)
    Loading from cache
  – Installing bower-asset/yii2-pjax (v2.0.4)
    Loading from cache
  – Installing yiisoft/yii2 (2.0.4)
    Loading from cache
  – Installing swiftmailer/swiftmailer (v5.4.1)
    Loading from cache
  – Installing yiisoft/yii2-swiftmailer (2.0.4)
    Loading from cache
  – Installing yiisoft/yii2-codeception (2.0.4)
    Loading from cache
  – Installing bower-asset/bootstrap (v3.3.5)
    Downloading: 100%
  – Installing yiisoft/yii2-bootstrap (2.0.4)
    Loading from cache
  – Installing yiisoft/yii2-debug (2.0.4)
    Loading from cache
  – Installing bower-asset/typeahead.js (v0.10.5)
    Loading from cache
  – Installing phpspec/php-diff (v1.0.2)
    Loading from cache
  – Installing yiisoft/yii2-gii (2.0.4)
    Loading from cache
  – Installing fzaninotto/faker (v1.5.0)
    Loading from cache
  – Installing yiisoft/yii2-faker (2.0.3)
    Loading from cache
fzaninotto/faker suggests installing ext-intl (*)
Writing lock file
Generating autoload files
あれ、もう終わり？

上級テンプレートなので、あとは初期化して、

$ php yii2-app-advanced/initYii Application Initialization Tool v1.0
Which environment do you want the application to be initialized in?
  [0] Development
  [1] Production
  Your choice [0-1, or “q” to quit] 0
  Initialize the application under ‘Development’ environment? [yes|no] yes
  Start initialization …
   generate backend/config/main-local.php
   generate backend/config/params-local.php
   generate backend/web/index-test.php
   generate backend/web/index.php
   generate common/config/main-local.php
   generate common/config/params-local.php
   generate console/config/main-local.php
   generate console/config/params-local.php
   generate frontend/config/main-local.php
   generate frontend/config/params-local.php
   generate frontend/web/index-test.php
   generate frontend/web/index.php
   generate yii
   generate cookie validation key in backend/config/main-local.php
   generate cookie validation key in frontend/config/main-local.php
      chmod 0777 backend/runtime
      chmod 0777 backend/web/assets
      chmod 0777 frontend/runtime
      chmod 0777 frontend/web/assets
      chmod 0755 yii
      chmod 0755 tests/codeception/bin/yii
  … initialization completed.
ちなみに開発環境としての初期化ね。

次に、MySQLデータベース上に、ユーザーとデータベースを作成し、次のファイルをユーザ名とデータベース名に合わせて編集。
c:/xampp/htdocs/yii2-app-advanced/common/config/main-local.php

return [
    ‘components’ => [
        ‘db’ => [
            ‘class’ => ‘yiidbConnection’,
            ‘dsn’ => ‘mysql:host=localhost;dbname=yii’,
            ‘username’ => ‘yii’,
            ‘password’ => ‘yii’,
            ‘charset’ => ‘utf8’,
        ],
        ‘mailer’ => [
            ‘class’ => ‘yiiswiftmailerMailer’,
            ‘viewPath’ => ‘@common/mail’,
            // send all mails to a file by default. You have to set
            // ‘useFileTransport’ to false and configure a transport
            // for the mailer to send real emails.
            ‘useFileTransport’ => true,
        ],
    ],
];

Windowsでgulpを使ってBrowsersyncしたい。

まずは、次のページからGitのWindows用セットアップファイルをダウンロードする。
http://git-scm.com/downloads/
EXEを実行して、インストール。標準設定でOK？

続いて、次のページからnode.jsのWindows用セットアップファイルをダウンロードする。
https://nodejs.org/download/
msi、またはEXEを実行して、インストール。標準設定でOK？

まず、GitBashのショートカットのプロパティを開いて、詳細設定で管理者で実行するようにチェックしておく。

そして、GitBashを起動。
次のコマンドでgulpをインストール

$ npm install -g gulp

で、インストールは終わった。
あとは、Browsersyncを目指す！

昨日はBasicなテンプレートをインストールしたが、今日はAdvancedなテンプレートをインストールしてみる。
こちらを参考に、昨日と違うコマンドを実行。

$ composer create-project –prefer-dist yiisoft/yii2-app-advanced yii-advanced
Installing yiisoft/yii2-app-advanced (2.0.4)
– Installing yiisoft/yii2-app-advanced (2.0.4)
Downloading: 100%
Created project in yii
Loading composer repositories with package information
Installing dependencies (including require-dev)
– Installing yiisoft/yii2-composer (2.0.3)
Loading from cache
– Installing ezyang/htmlpurifier (v4.6.0)
Loading from cache
– Installing cebe/markdown (1.1.0)
Loading from cache
– Installing bower-asset/jquery (2.1.4)
Loading from cache
– Installing bower-asset/jquery.inputmask (3.1.63)
Loading from cache
– Installing bower-asset/punycode (v1.3.2)
Loading from cache
– Installing bower-asset/yii2-pjax (v2.0.4)
Loading from cache
– Installing yiisoft/yii2 (2.0.4)
Loading from cache
– Installing swiftmailer/swiftmailer (v5.4.1)
Downloading: 100%
– Installing yiisoft/yii2-swiftmailer (2.0.4)
Loading from cache
– Installing yiisoft/yii2-codeception (2.0.4)
Loading from cache
– Installing bower-asset/bootstrap (v3.3.4)
Loading from cache
– Installing yiisoft/yii2-bootstrap (2.0.4)
Loading from cache
– Installing yiisoft/yii2-debug (2.0.4)
Loading from cache
– Installing bower-asset/typeahead.js (v0.10.5)
Loading from cache
– Installing phpspec/php-diff (v1.0.2)
Loading from cache
– Installing yiisoft/yii2-gii (2.0.4)
Loading from cache
– Installing fzaninotto/faker (v1.5.0)
Loading from cache
– Installing yiisoft/yii2-faker (2.0.3)
Loading from cache
fzaninotto/faker suggests installing ext-intl (*)
Writing lock file
Generating autoload files

次にアプリケーションの初期化。因みに開発環境での初期化。

あとは、MySQLのデータベースを作成し、その内容でPHPファイルを更新。

$ vi yii-advanced/common/config/main-local.php

今回は、MAMPを利用しているので、ポートが8889となっている。
データベース名は、yii。
ユーザもyii。

あと、hostはlocalhostだと、migration時に次の様なエラーになるため、127.0.0.1に変更しておく。

Exception ‘yiidbException’ with message ‘SQLSTATE[HY000] [2002] No such file or directory’

in yii/vendor/yiisoft/yii2/db/Connection.php:534

情報を元に、データベースの初期構成を行ってもらう。

Migrated up successfully.

これで次のURLでフロントエンド、バックエンドのページが表示される。

http://localhost:8888/yii-advanced/frontend/web/index.php
http://localhost:8888/yii-advanced/backend/web/index.php

落とし穴いっぱい。疲れるよ。