Skip to content

MS_VSToolsForApacheCordova

Jump to bottom
nishi_74322014 edited this page Sep 11, 2026 · 2 revisions

Visual Studio Tools for Apache Cordova

概要

  • Android、iOS そして Windows アプリの開発に対応
  • Cordova CLI をブラックボックス化しているが、Cordova CLI に追随できていない。
  • ≒ メンテナンス・フェーズ（Cordova Tools Extension に
    移行すべき）。

補足（その後：完全に廃止された）: 「メンテナンス・フェーズ」という
見立ては正しく、製品自体が提供終了となった。

【廃止までの経緯】★
   2015  Visual Studio 2015 に標準バンドル
   2017  VS 2017 でも提供（ワークロードとして選択）
   2019  【VS 2019 では提供されない】★
         → Microsoft は
           「VS Code + Cordova Tools を使え」と案内
   2020  taco.visualstudio.com（公式サイト）が閉鎖

【廃止の理由（本ページの指摘どおり）】
   ・「Cordova CLI をブラックボックス化しているが、
     Cordova CLI に追随できていない」★
     → これがまさに致命傷になった
     → ラッパーは【本体の進化に追随し続ける義務】を負う
     → 追随できなくなった時点で
       「使いにくい古い CLI」になってしまう

【一般化できる教訓】★
   ・ツールが下位レイヤを隠す場合、
     【隠したものを保守し続ける覚悟】が要る
   ・隠さない設計（薄いラッパー、素の CLI も見える）なら
     本体が進化しても壊れにくい
     → [開発支援ツール](MS_DevelopmentSupportTools) の
       「ツールはエンジニアリングを補完する」議論と同じ

インストール

概要

  • Visual Studio 2015 から Visual Studio 本体のインストーラーに標準バンドル

  • デフォルトでは組み込まれないため、インストール時に、
    [HTML/JavaScript (Apache Cordova) xxxx] チェックボックスを ON にする。

  • Node.js や Java JDK、Android SDK、エミュレータなど同時にインストールされる。

問題

幾つかのプロダクトはインストールされるが、以下の問題がある。

  • 必要なディスク容量が多い。

  • Visual Studio Emulator for Android
    （Androidのデバッグの該当節を参照）の制限がある。

  • バージョンが古い

C:\Users\xxxx>node -v
v0.12.2
C:\Users\xxxx>npm -v
2.7.4
  • エラーが起きる
C:\Users\xxxx>cordova -v
C:\Users\xxxx\AppData\Roaming\npm\node_modules\cordova\node_modules\cordova-lib\node_modules\init-package-json\node_modules\read-package-json\node_modules\json-parse-better-errors\index.js:9
SyntaxError: Use of const in strict mode.
  • ユーザー環境変数の設定などは別途行う必要がある。

補足（このエラーの意味）: 記録されているエラーは、
「同梱ツールの古さ」がどう表面化するかの典型例である。

【SyntaxError: Use of const in strict mode.】★
   ・Node.js 【v0.12】は
     strict モード外での const / let をサポートしない
     （ES6 対応が不完全な世代）
   ・一方、後から npm install した
     新しいパッケージ（json-parse-better-errors 等）は
     【ES6 構文で書かれている】
   → 【古いランタイム × 新しい依存パッケージ】
     という組み合わせで構文エラーになる

【なぜ起きたか】
   ・VS が同梱した Node.js は
     インストール時点で固定される
   ・npm のパッケージは【常に最新が降ってくる】
   → 時間が経つほど乖離が広がる ★

【回避策（当時）】
   ・別途、新しい Node.js を入れて
     【PATH の優先順位を変える】
   ・VS の設定で
     「グローバルの Node.js / Cordova CLI を使う」に切り替える

【現在の一般解】★
   ・【nvm-windows / fnm】で Node のバージョンを切り替える
   ・プロジェクトに【.nvmrc】を置いて版を固定する
   ・package.json の engines で要求版を明示する
   ・【コンテナ】でビルド環境ごと固定する ★★
     → 「同梱ツールが古い」問題が原理的に起きない

開発

プロジェクト・テンプレートの選択

  • メニュー ---> ファイル ---> 新規作成 ---> プロジェクト
  • テンプレート ---> JavaScript ---> Apache Cordova Apps
    から、[空のアプリ(Apache Cordova)] を選択する。

プロジェクトのデバッグ実行

  • 標準のツールバーにある、デバッグ ---> Android ---> Ripple - Nexus (Galaxy) を押下。

  • Ripple エミュレーター通信用にファイアウォール設定変更ダイアログでこれを許可。

  • Google Chrome 上の Ripple エミュレーターでアプリケーションが実行される。

  • 補足

    • その他のエミュレータや、実機を使用してデバッグするには
      Androidのデバッグを参照。
    • なお、VS2017 からは、VS2017 で定義したエミュレーターイメージのみに対応。
      （AVD Manager で定義したエミュレーターイメージへのデプロイは対応していない）。

補足（Ripple エミュレーターについて）: 説明なく出てくるため補っておく。

【Apache Ripple】★
   ・Chrome 上で動く【Cordova アプリのシミュレータ】
     → 実機やエミュレータを起動せずに
       ブラウザ内で動作確認できる
     → デバイス サイズ、GPS、加速度センサ等を
       擬似的に設定できる
   ・実体は Chrome 拡張／Node のサーバ

   ・【2015年に Apache Incubator を退出（retired）】★
     → 以降、開発は行われていない
     → 新しい Chrome では動作しない

【現在の代替】★
   ・Chrome DevTools の【デバイス モード】
     → レスポンシブ確認は標準機能で足りる
   ・【cordova-simulate】（Cordova Tools 拡張が使用）
     → プラグイン API のモックまで行える ★
   ・実機の【リモート デバッグ】
     → Android: chrome://inspect
     → iOS: Safari の Web インスペクタ
     → 【最も確実】。現在はこれが基本 ★

Cordovaプラグインの追加

  • GUI でインストール可能。
  • config.xml ファイルをダブルクリックすると、コンフィギュレーションデザイナーが
    開くので、ソコで設定
    （[プラグイン] タブ ---> [コア] タブ ---> プラグイン選択 ---> [追加] をクリック）。
  • config.xml ファイルを直接編集しなければならないこともある
    （バージョン情報を変更する場合など）。

デプロイ

Android

Visual Studio＋Apache Cordova の該当節を参照。

iOS

Visual Studio＋Apache Cordova の該当節を参照。

付属の vs-mda-remote を Mac OS X 上にインストールしてリモートデバッグ可能。

補足（vs-mda-remote という発想）: この「リモート エージェント」方式は、
現在も形を変えて生きている。

【なぜ必要か】★
   ・iOS アプリのビルド・署名には
     【Xcode（＝ macOS）が必須】
   ・Windows の Visual Studio からは直接できない
   → Mac 側にエージェントを常駐させ、
     ソースを転送してビルドさせ、
     結果を受け取る

【同じ発想の後継】
   ・【Pair to Mac】（Xamarin / .NET MAUI）★
     → 現在も使われている
     → Windows の VS から Mac に SSH で接続し、
       ビルドと実機デプロイを行う
   ・【クラウド ビルド】★★
     → GitHub Actions の macOS ランナー
     → Codemagic / Bitrise / Xcode Cloud
     → 【Mac を自前で持たなくてよい】
     → 現在の主流

【変わっていないこと】
   ・Apple のツールチェーンが
     【macOS でしか動かない】という制約 ★
   → クロスプラットフォーム開発における
     恒久的な制約であり、
     本ページ執筆時から一貫している

参考

microsoft.com

Project_Readme.html

msdn.microsoft.com

support.microsoft.com

＠IT

移行メモ（リンクの重複）: ＠IT の連載の第 2 回と第 3 回が
同一の URL（1603/29/news032.html）になっている。
第 3 回（2016/05/20 公開）の URL としては誤りと思われるが、
正しい URL を特定できないため移行元のまま残した。

その他

移行メモ（リンク切れ）: 本ページの参考リンクは
大半が到達しないと考えられる。

  • msdn.microsoft.com … Microsoft Learn へ統合（VS TACO の記事は
    製品廃止に伴い削除されたものが多い）
  • blogs.msdn.microsoft.com … 2019〜2020 年にアーカイブへ移行
  • microsoft.com/ja-jp/dev/campaign/vs-cordova.aspx … キャンペーン ページは撤去
  • go.microsoft.com/fwlink/?LinkId=... … リダイレクト先が失われている
  • azure.microsoft.com/documentation/articles/... … 現在の Learn の URL 体系と異なる
  • codeiq.jp … CodeIQ は 2018 年にサービス終了

記録として残す。

Tags: 移行, .NET開発, モバイル系開発

このWikiは「Open棟梁Project」,「OSSコンソーシアム 開発基盤部会」によって運営されています。

NetDevInfraWiki

マイクロソフト系技術情報 Wiki
Open 棟梁 Wiki

（未着手）

開発基盤部会 Wiki

移行管理: DONE ／ TODO

Clone this wiki locally