Quantcast
Channel: Node.jsタグが付けられた新着記事 - Qiita
Viewing all articles
Browse latest Browse all 8829

開発環境の1つであるVSCodeの開発環境についてチラ見してみる

$
0
0

リーマンサットについて

趣味で宇宙開発を行う団体「リーマンサット・プロジェクト」がお送りする新春アドベントカレンダーです。インデックスはこちら

リーマンサット・プロジェクトは「普通の人が集まって宇宙開発しよう」を合言葉に活動をしている民間団体です。
他では経験できない「宇宙開発プロジェクト」に誰もが携わることができます。
興味を持たれた方は https://www.rymansat.com/joinからお気軽にどうぞ。

概要

機械学習周りやWEBサービスを担当してますAkira Sugawaraです。

開発環境、、、エンジニアなら誰しも気になりますよね?
リーマンサットでは趣味開発なので、特に大きな制限を設けずに自由に開発しています。
開発エディタはVSCodeやIntelliJ、ソースコード・タスク管理はBacklog、といった感じです。

VSCodeの開発環境

ふと、VSCodeってどう作られてるんだろうか、どんな開発環境なんだろうか、と考えてしまいました。
思いを馳せると夜も眠れなくなってしまいます。

開発環境の一部であるエディタを開発している開発環境は、さぞこだわりがあるんだろう…。

ということで、本記事ではVSCodeの開発環境を調べてみます。

VSCodeのツールチェーン

2019/12/30時点でのmasterブランチをcloneして確認しています。。

typedetails
Languagetypescript,javascript
Application FrameworkElectron
LinterESLint, TSLint
Formatterprettier
TaskRunnerNPM, gulp
TestFrameworkmocha
CI/CDAzure Pipeline

CI/CDに関しては、./build/azure-pipelinesのフォルダの下にOS毎のビルド定義ファイルが格納されています。
さすがにMicrosoftのOSSということなので、Azureになってるんですね。

使用してるVSCodeExtension

もちろんVSCodeの開発もVSCodeですよね!
ワークスペースのRecommendリストは下記です。

  1. "ms-vscode.vscode-typescript-tslint-plugin"

    eslintがtypescriptサポートを強化するという発表もありましたが、フロントエンドによくあるESLint/TSLint併用構成のようです

  2. "dbaeumer.vscode-eslint"

    言わずもしれたESLintのvscodeプラグインです。

  3. "EditorConfig.EditorConfig"

    恥ずかしながら使用経験がありませんでした。
    複数人で作業するときのEditorのConfigurationToolで、言語非依存・エディター非依存で規約の準拠が可能になります。
    Prettierと役割重なってるんじゃない?と思いましたが、この記事が違いがわかりやすかったです。

  4. "msjsdiag.debugger-for-chrome"

    Chromeでjavascriptをデバックするための連携ツールです。

まとめ

さらーっと、VSCodeの開発環境を見ていきました。
何かしらのプロジェクトで新しく開発を始める場合、著名なOSSの環境を見てみるのは参考になるかもしれませんね。

次の記事は、@KingBritainの「航空機の流体力学(2次元翼の流体解析)」になります。

参考

GitHub
How to build


Viewing all articles
Browse latest Browse all 8829

Trending Articles