HiroKws / code-for-laravel7

vscode settings for PHP framework Laravel 7.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Laravel7をvscodeで利用する設定例

これは以下の記事に書いたvscodeの設定例である。

確認時の要件

  • OS : Linux(openSUSE)
  • vscode : 1.43.1
  • Laravel : ^7.0

必要なLaravelの準備

必要なvscodeエクステンション

  • Trigger Task on Save (id: gruntfuggly.triggertaskonsave)

リポジトリーの目的

Laravel7での開発時にvscodeをIDE化するため、タスクの自動化を安定して実行する。

問題

ファイル監視に関わるトラブルを防ぐ。ファイル監視を行う目的は通常、ファイルの内容や構成の変化でプログラムを起動することである。しかしプログラムが目的とする出力はファイルのことは多いため、プログラム動作の副作用で意図せぬファイルの生成や変更起きることがある。

ファイル監視は本来監視対象と動作させるプログラム、結果として変化が起きるファイルなどをしっかりと把握すべきなのだが、そうした情報を見せずに簡単に実現できるようになった。その結果ユーザーがブラックボックス的に使用することにより、最悪でデッドロックや永久ループ、フリーズの発生、メモリやCPUなどのリソースの食いつぶし、意図せぬ不具合が発生しがちである。

ファイル監視が1つであっても、監視対象と影響を受けるファイルの指定によっては永久的に繰り返すことがある。ファイル監視を複数で利用すると状況は複雑になる。

vscode自身は外部でファイルが変更されたときにエディターの表示を変更するためにファイルを監視している。統合されたGit機能もファイルの変更により、状態表示が自動的に切り替わる。これらはすべてファイル監視で実現している。vscodeのエクステンションは別個のプログラムであるため、それぞれがファイル監視を独自に行うこともできる。

外部の自動タスク実行機能は通常ファイルの変更をトリガーにする。Laravelに統合されているMixも同様だ。

こうしたリソース監視は、開発機の状態や開発環境を安定させるためにしっかり把握すべきだが、前述の通り簡単に使えることを売りにするためブラックボックス化されている。設定の失敗によるリソースの競合、それによるトラブルはフリーズやブルースクリーンという明確な障害になることもあれば、ある1つのプログラムのフリーズやたまに自動実行されないというマイナーなトラブルになることもある。それは競合状態が起きる、もしくは続くかどうかは、タイミングも関わるためだ。

もちろん、ユーザーが経験豊かであれば、こうしたトラブルに気づくこともでき、解決も可能だ。しかし、開発のビギナーや知識の少ない初学者では原因の追求は難しいし、トラブルが起きていることさえ見逃してしまいがちだ。

経験があり、ソフトとハード両面から不具合の特定ができるレベルの開発者であれば、現象に気づき対処可能であるから、余計な話である。Mixをシンプルに使うのも良い。ユースケース80%を行うのがMixの謳い文句だ。

ただ、そこまでの経験を持つ開発者がMixを使うかどうかは疑問である。より土台に近いwebpackやnpm、シェルスクリプトなどで実現するほうが自由度が大きい。手間がかかるのでおまかせしたいのは、BrowserSyncくらいではないだろうか。

対策

  • Laravel Mixが提供するファイル監視(watch)によるリソースのコンパイルを行わない。代わりにvscodeがリソースファイルを「保存」するときにLaravel Mixが提供するリソースのコンパイルを行う。

  • WebページのリロードにはMixが提供するBrowserSyncを使用する。この機能も独自にファイル監視を行うが、目的はWebページのリロードであり、ファイルを出力するものではないため、他の監視プログラムに影響を与えない。

その他

Laravel Mixは単一の設定ファイルをサポートしている。状況により設定ファイルを分け、別々の動作をさせたい場合にそのままでは使用できない。これの対策方法を具体的に取っている。

標準的にMixを動作させる場合、cssとjsのコンパイルが行われてしまう。cssとjsのコンパイルを分ける設定をしている。それによりリソースのsassファイルの変更時はcssのコンパイル、jsファイルの変更時はjsの困憊のみを行う。これはファイルの数や大きさが増えるにつれ、コンパイル時間を節約する。(より巨大になる場合は、より細かく設定する必要が起きる。そうした場合はMixを使用するより、webpackやgulpなど自由度の高い土台となる技術を使用したほうが簡単に実現できるだろう。)

また、PHPを使う場合の変数で"$"、CSSを使用する場合の"#"による色指定で、vscodeのデフォルトでは記号がワードによる選択範囲に入らない。ワードの区切り記号に指定されているためである。それを外したワードの区切り文字の指定を含んでいる。この設定で$#もダブルクリックなどのワード選択で含まれるようになる。この振る舞いではなくデフォルト動作が好ましい場合は、設定を削除すれば良い。

vscodeの起動時にLaravelプロジェクトへインストールしたHomestead Boxを起動する方法も含めている。

Issue

ワークスペースを利用した場合にvagrantの自動実行が動作しない。

About

vscode settings for PHP framework Laravel 7.


Languages

Language:JavaScript 100.0%