快適な(≒効率的な)laravel開発環境を(VSコード編)

268 View

この記事は私自身がなにかしらの理由で快適な環境を見失ったときに、元に戻せるように書いときます。

ただ、この内容はOSやそのほかの環境等が影響しているかもしれないので、私以外の場合でも成り立つかわかりません😅

ちなみに、いろんなやつを最新にアップデートしたら、以下の3つのうちどれかが機能しなくなったので今回、この記事を書くにいたりました。

話しはとぶけど、こういうことは、以外とあって、それこそ自分のもっている携帯(5年くらいまえの機種)も最新のslackのアプリには、対応していない。

だから、わざわざ、少し昔のスラックのAPKファイルをひっぱってきて携帯内で動かすっていう、めんどいこともしてます、(笑)

ひとまず、快適さに必要不可欠な機能

個人的には、

「定義」の確認・・・①

「参照」を見る・・・➁

「VIEWファイル」へとぶ・・・③

の3機能がたもたててれば、問題ないかな

「定義」の確認・・・①

「参照」を見る・・・➁

この2つは、こいつだな↓

このぞうさんマークはもう必須!

だけど、定義への移動も、参照もできないことがある。

自分は、次のことでなおした、

・歯車マークから別versionをインストールする

・これでも、直らないとき、自分もそうだったが、次はこれだ

intelephense.diagnostics.undefinedTypesのチェックを外す

これで、定義も参照もとべるはず

こんな感じでメソッドやクラスを右クリックでできたらOK

「VIEW」ファイルへとぶ・・・③

そもそも、今回はこれができなくて色々したんだよな、

これは、自分の場合はこれでいけた↓

まあ、でもLaravel Gotoのversionを、下げたり、あげたり、

vsコードのversionを下げたりして、機能するようになった。

これがうごけば、VIEWファイルからコンポーネントへ一発でとべるが、

無いとVIEWの根っこからさがしていくことになる。

たとえば、↓の例だと、わざわざcommonフォルダのone_block_reserve_info.blade.phpファイルを目視で探す手間がかかる。まあ、これくらいの階層だとそんなに大変じゃないけど、階層がもっと深くなると相当時間のむだになっちゃう。

あとは、vsコードの自分のユーザー設定jsonを貼っとこう


{
  /* 基本設定 */
  "editor.fontSize": 18, // エディター文字サイズ
  "debug.console.fontSize": 16, // コンソール文字サイズ
  "terminal.integrated.fontSize": 16, // ターミナル文字サイズ
  "editor.formatOnPaste": true, // ペースト時自動フォーマット
  "editor.formatOnSave": true, // 保存時自動フォーマット
  "editor.formatOnType": true, // 入力時自動フォーマット
  "editor.tabSize": 2, // タブ文字数
  "editor.hover.enabled": false, // ホバー時メッセージ表示
  "editor.mouseWheelZoom": true, // マウスホイール文字サイズ変更:Ctrl + ホイール
  "editor.renderControlCharacters": true, // 制御文字表示
  "editor.renderLineHighlight": "all", // 選択行の行番号ハイライト
  "editor.renderWhitespace": "all", // ホワイトスペース(半角スペース等)の表示
  "editor.minimap.renderCharacters": false, // ミニマップの文字をブロック表示
  "editor.minimap.showSlider": "always", // ミニマップ表示領域をハイライト
  "editor.bracketPairColorization.enabled": true, // ブラケットを色分け表示
  "explorer.compactFolders": false, // エクスプローラの省略表示しない
  "files.insertFinalNewline": true, // 保存時に末尾を空行にする
  "files.trimFinalNewlines": true, // 保存時に最終行以降を削除
  "files.trimTrailingWhitespace": true, // 保存時に行末のホワイトスペースを削除
  "workbench.editor.wrapTabs": true, // 画面全体の表示サイズ
  "window.title": "${dirty}${activeEditorMedium}${separator}${rootName}", // フルパス表示
  "vsintellicode.modify.editor.suggestSelection": "automaticallyOverrodeDefaultValue", // サジェスト一覧の初期表示項目設定
  /* キー変更 */
  "editor.multiCursorModifier": "ctrlCmd", // マウスでカーソル複数作成時のキー変更
  /* 文字コード */
  "files.autoGuessEncoding": false, // 文字コード自動判別(ワークスペースで文字コード設定する)
  /* エクスプローラー */
  "files.associations": {
    // ファイルと言語の関連付けを変更
    ".tpl": "php"
  },
  "files.exclude": {
    // 非表示にするファイル
    "**/.DS_Store": true
  },
  "search.exclude": {
    // 検索結果から除外するファイル
    "**/tmp/cache": true
  },
  /* HTML */
  "html.format.extraLiners": "", // <head>,<body>,</html>タグ前に空行を入れない
  "html.format.contentUnformatted": "pre, code, textarea, title, h1, h2, h3, h4, h5, h6, p", // フォーマットしない要素を指定
  "html.format.unformatted": null, // インライン要素をフォーマットしない
  /* Emmet */
  "editor.snippetSuggestions": "top", // Emmetのスニペット候補を優先表示
  "emmet.showSuggestionsAsSnippets": true, // Emmetの候補を表示
  "emmet.triggerExpansionOnTab": true, // TABキーでEmmet展開
  "emmet.variables": {
    // Emmet展開のHTML言語変更
    "lang": "ja"
  },
  "editor.suggestSelection": "first",
  "files.autoSave": "afterDelay",
 "editor.detectIndentation": false,
  "editor.defaultFormatter": "shufo.vscode-blade-formatter",
  "bladeFormatter.format.indentSize": 2,
  "[dart]": {
    "editor.formatOnSave": true,
    "editor.formatOnType": true,
    "editor.rulers": [
      80
    ],
    "editor.selectionHighlight": false,
    "editor.suggest.snippetsPreventQuickSuggestions": false,
    "editor.suggestSelection": "first",
    "editor.tabCompletion": "onlySnippets",
    "editor.wordBasedSuggestions": "off"
  },
  "dart.previewFlutterUiGuides": true,
  "dart.previewFlutterUiGuidesCustomTracking": true,
  "security.workspace.trust.untrustedFiles": "open",
  "git.openRepositoryInParentFolders": "never",
  "[php]": {
    "editor.defaultFormatter": "bmewburn.vscode-intelephense-client"
  },
  "[postcss]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "tailwindCSS.experimental.configFile": null,
  "extensions.autoCheckUpdates": false,
  "update.mode": "none",
  "intelephense.diagnostics.undefinedTypes": false

}


まあ、あとは、拡張機能もはっとこう。

absszero.vscode-laravel-goto
alexisvt.flutter-snippets
anteprimorac.html-end-tag-labels
bmewburn.vscode-intelephense-client
bradlc.vscode-tailwindcss
circlecodesolution.ccs-flutter-color
Dart-Code.dart-code
Dart-Code.flutter
esbenp.prettier-vscode
formulahendry.auto-rename-tag
marcelovelasquez.flutter-tree
MS-CEINTL.vscode-language-pack-ja
ms-vscode-remote.remote-wsl
Nash.awesome-flutter-snippets
oderwat.indent-rainbow
onecentlin.laravel-blade
onecentlin.laravel5-snippets
ryannaddy.laravel-artisan
saikou9901.evilinspector
shufo.vscode-blade-formatter
techer.open-in-browser
VisualStudioExptTeam.intellicode-api-usage-examples
VisualStudioExptTeam.vscodeintellicode
xabikos.JavaScriptSnippets
xdebug.php-debug

カテゴリー:

返信がありません

コメントを残す