導入

npm コマンドで、Yeoman と拡張機能の雛型ジェネレータをインストールする。

>npm install -g yo generator-code

yo コマンドで雛型を生成する。

>yo code

作成した雛型プロジェクトに移動する。

>cd my_project
操作

F5拡張機能開発ホストを起動する

参考:

はじめての拡張機能開発 – Qiita

VSCode の拡張機能を作ってみた | Tomiaki Matsumura

VSCode の拡張開発に入門してみました | GMO アドパートナーズグループ TECH BLOG

VSCode に英語翻訳拡張機能を自作する | The only neEt thing to do.

Your First Extension | Visual Studio Code Extension API [Official]

概要

参考:

Extension Guides | Visual Studio Code Extension API [Official]

仕組み/構造/ファイル構成

参考:

Extension Anatomy | Visual Studio Code Extension API [Official]

言語拡張

  • シンタックスハイライト
  • スニペット
  • 文法規則

参考:

VSCode で俺々言語モードを作る – Qiita

VSCode 用の Grimoire.js language extension を作ったよ – Qiita

VSCode のシンタックスハイライトの作り方 | KAYAC engineers’ blog

Language Extensions Overview | Visual Studio Code Extension API [Official]

Syntax Highlight Guide | Visual Studio Code Extension API [Official]

Snippet Guide | Visual Studio Code Extension API [Official]

Language Configuration Guide | Visual Studio Code Extension API [Official]

VSCode Python Language Extension – Stack Overflow

翻訳/ローカライズ

サンプル

リポジトリ:

i18n-sample – microsoft/vscode-extension-samples – GitHub

参考:

拡張機能のメッセージを言語設定に合わせてローカライズしてみる – Qiita

拡張のローカライズ対応方法 – Qiita

拡張機能のコマンドタイトル名をローカライズしてみる – Qiita

How to localise VSCode extension – Stack Overflow

Automatically create i18n directory for VSCode extension – Stack Overflow

Manifest

参考:

Extension Manifest | Visual Studio Code Extension API [Official]

再読み込み (Reload)

参考:

How to restart VSCode after editing extension’s config? – Stack Overflow

Change VSCode debugging action (restart button) – Stack Overflow

テスト

参考:

Testing Extensions | Visual Studio Code Extension API [Official]

公開

参考:

Publishing Extensions | Visual Studio Code Extension API [Official]

バンドル

参考:

Bundling Extensions | Visual Studio Code Extension API [Official]

Lint

参考:

Migrate from TSLint to ESLint | Visual Studio Code Extension API [Official]

ガイドライン

参考:

Extension Guidelines | Visual Studio Code Extension API [Official]

サンプル

リポジトリ:

microsoft/vscode-extension-samples: Sample Code Illustrating the VSCode Extension API – GitHub

まとめ

参考:

Wrapping Up | Visual Studio Code Extension API [Official]

nls

リポジトリ:

microsoft/vscode-nls: npm Module to Support Externalization and Localization of VSCode Extensions – GitHub

microsoft/vscode-nls-dev: The Tools Automates the Extraction of Strings to be Externalized from TS and JS Code – GitHub

入手:

vscode-nls – npm

vscode-nls-dev – npm

参考:

How to create the i18n folder structure automatically using vscode-nls-dev · Issue #74 · microsoft/vscode-extension-samples – GitHub

Extension Localisation

リポジトリ:

sketchbuch/vscode-ext-localisation: Localisation for VSCode Extensions using package.nls.json Files – GitHub

入手:

vscode-ext-localisation – npm

記事をシェアする:
タグ:

コメントを残す

メールアドレスが公開されることはありません。

Protected by reCAPTCHA