monacaで作ったアプリをブラウザで動かす

目的

• monacaで作成したandroidアプリをWebアプリに載せ替えて欲しいという依頼があった

TL;DR

• monaca cliはcordova cliの機能がそのまま使える

$ monaca platform add browser
$ monaca run browser

で解決。

検証内容

• monaca cliで試した。
• おそらくブラウザ版monacaのIDEからプロジェクトを作って、プロジェクトのエクスポートをしても同様に動くはず

$ npm install -g monaca
$ monaca create test-monaca-app
$ cd test-monaca-app/
$ monaca platform add browser
$ monaca run browser

• でブラウザでサンプルアプリが起動した
• monaca cliのコマンドはヘルプにplatformに関する記載は無いが、普通に使える
• monaca cliにはpreviewというコマンドがあるので、これと同じことなのかも
• $ monaca previewも試したが、Webアプリとしてブラウザから操作することができた
• $ monaca previewと$ monaca run browserの違いについては調べていない

$ monaca
 __  __
|  \/  | ___  _ __   __ _  ___ __ _
| |\/| |/ _ \| '_ \ / _` |/ __/ _` |
| |  | | (_) | | | | (_| | (_| (_| |
|_|  |_|\___/|_| |_|\__,_|\___\__,_|

 Command Line Interface for Monaca and Onsen UI
 Monaca CLI Version 2.7.9

Usage: monaca command [args]

  To learn about a specific command type:

  $ monaca <command> --help

Commands: (use --help to show all)

  login  ..........  sign in to Monaca Cloud
  logout  .........  sign out from Monaca Cloud
  signup  .........  register a new Monaca account
  download  .......  download a project from Monaca Cloud
  upload  .........  upload a project to Monaca Cloud
  signing  ........  manage signing configurations
  remote build  ...  build a project on Monaca Cloud
  remote config  ..  open the project configuration on Monaca Cloud
  preview  ........  run a local web server for preview
  demo  ...........  display the app appearance on iOS and Android
  debug  ..........  run app on device using Monaca Debugger
  transpile  ......  transpile project source code
  config  .........  manage Monaca configuration
  reconfigure  ....  generate default project configurations
  docs  ...........  display docs for Monaca CLI, Onsen UI and Tutorials
  info  ...........  display project and environment info

Typical Usage:

  $ monaca create myproject # Create a new project from various templates
  $ cd myproject
  $ monaca preview # Preview app on a browser
  $ monaca debug # Run the app in Monaca Debugger
  $ monaca remote build # Execute remote build for packaging