Monacaチームの小田川です。
Monacaで開発を行う場合、
- MonacaクラウドIDE
- Monaca Localkit
- Monaca CLI
を使用して開発を行うことができます。
Monaca LocalkitやMonaca CLIで開発を行う場合は、ローカルPCにインストールされているエディターを使用することができるため、エディターが提供しているテーマ等を使用して自分好みのフォントや背景色に変更して使用している利用者も多いと思います。
MonacaクラウドIDEでもワークスペース設定/エディター設定画面のフォント関連やテーマ等を変更することで、エディターの表示を変更できるようになっています。
今回は、MonacaクラウドIDEのエディター設定について見ていきたいと思います。
エディター設定
MonacaクラウドIDEから通常モードでプロジェクトを開いた場合は、以下のメニューからエディター設定にアクセスすることができます。
- 設定 - ワークスペース設定
通常モードでは、ターミナル機能が利用できるため、ワークスペース設定には、以下の2つの設定項目があります。エディター設定を行う場合は、EDITOR CONFIGURATION項目を変更します。
- EDITOR CONFIGURATION
- TARMINAL CONFIGURATION
MonacaクラウドIDEでは、プロジェクトを開く際のオプションとしてライトモードが用意されています。ライトモードでプロジェクトを開いた場合は、ターミナル機能が利用できなくなるため、以下のメニューからエディター設定にアクセスすることができます。
- 設定 - エディター設定
エディター設定を行う場合は、EDITOR CONFIGURATION項目を変更します。
EDITOR CONFIGURATIONの設定内容
EDITOR CONFIGURATION項目では、以下の設定を行うことができます。記載している設定は、デフォルトの設定になります。
- フォントファミリー：Default（Ricty Diminished）
- フォントサイズ：14
- テーマ：Visual Studio
- ミニマップ表示：Off
- ブラケットの自動閉じ：Off
- 自動インテント：On
- ステータスバー：Off
- ドラッグ&ドロップ：Off
- ホワイトスペースの表示：None
- 折り返し：On
- 折り返す長さ：80（変更不可）
- スペースによるインデント：On
- Tab サイズ：2
- デバッガー タブ：On
フォントファミリー
フォントファミリーでは、以下のフォントが利用できます。好みに合わせて変更することができます。
- Courier New
- DejaVu Sans Mono
- Droid Sans Mono Slashed
- M+
- M+ 1mn regular
- M+ 1p regular
- Monaco
- Default (Ricty Diminished)
- Source Code Pro
- Monacakomi
- MonacakomiRegular
- MonacakomiLite
- MonacakomiMinimum
- 梅ゴシックC4
フォントサイズ
フォントサイズは、11から80の間で設定することができます。
テーマ
テーマは、以下の設定が利用できます。
- Visual Studio
- Visual Studio Dark
- High Contrast Black
ミニマップ表示
コード量が少ない場合は、ミニマップを利用する事はないと思いますが、コード量が多い場合は、ミニマップ上から対象のコードへ素早く移動することができます。
ブラケットの自動閉じ
ブラケットの自動閉じ設定をOnにした場合は、自動で閉じ括弧が挿入されるようになります。構文エラーを防ぐことができるため、プログラミングに慣れていない場合は有効な機能になります。
自動インデント
自動インデント設定をOnにした場合は、Tab サイズの設定に合わせて自動でインデントが行われるようになります。
ステータスバー：Off
ステータスバー設定をOnにした場合は、フッターにステータスバーが表示されます。ステータスバーでは、ファイルの改行コードの確認および変更を行うことができます。
ドラッグ&ドロップ
ドラッグ&ドロップ設定をOnにした場合は、選択したコンテンツを任意の場所に移動させることができます。
ホワイトスペースの表示
ホワイトスペースの表示設定をBoundaryまたはAllにした場合は、ホワイトスペースの箇所に・が表示されるようになります。
折り返し
折り返し設定をOnにした場合は、折り返す長さに合わせてコードの折り返しが行われ、画面外に表示されていたコード部分が、画面内に表示されるようになります。
折り返す長さ
折り返す長さ設定は、80で固定になります。
スペースによるインデント
スペースによるインデント設定をOnにした場合は、インデントがTabからスペースに変換されます。ホワイトスペースの表示をBoundaryまたはAllににすることで、インデントに使用されているTabやスペースを確認することができます。
Tab サイズ
Tab サイズ設定では、インデントのサイズを設定します。
デバッガー タブ
デバッガー タブ設定をOnにした場合は、Monacaデバッガーから送信されるログ等を表示するデバッガー タブが表示されます。
おわりに
エディター設定を変更して自分好みのエディターにすることで、作業効率が上がるメリットがあります。これまでエディター設定を気にしていなかった場合は、一度、エディター設定を変更してみてください。思わぬ作業効率アップが望めるかもしれません。