【Vue CLI】cloud9でVue CLIをインストールすると「Invalid Host header」と言われる

以下が解決に至った手順

$ node -v
v10.7.0
$ nvm ls
        v8.16.0  
->      v10.7.0  
         system  
default -> v10.7.0
node -> stable (-> v10.7.0) (default)
stable -> 10.7 (-> v10.7.0) (default)
$ nvm version-remote stable
v12.7.0
$ nvm install stable
Now using node v12.7.0 (npm v6.10.0)
$ nvm current
v12.7.0
$ nvm alias default v12.7.0
default -> v12.7.0
$ yarn -v
1.17.3
 $ yarn global add @vue/cli
yarn global v1.17.3
$ vue --version
bash: vue: command not found //パスが通っていない
$ export PATH="$PATH:`yarn global bin`"
$ source ~/.bashrc
function
$ vue -V
3.9.3 //パスが通った
$ npm install -g vue-cli //グローバルでVue CLIをインストール
$ vue init webpack my-vuecli-app2 //Vueをwebpackパッケージでインストール
　// run yarn global add @vue/cli-initをaddonしろと言われる
  Command vue init requires a global addon to be installed.
  Please run yarn global add @vue/cli-init and try again.
$ yarn global add @vue/cli-init
yarn global v1.17.3
$ vue init webpack my-vuecli-app2 //改めてVueをwebpackパッケージでインストール

vueプロジェクトがインストールされると、プロジェクトディレクトリの中にpackage.jsonというものがありますので、中のdevの項目を

    "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",

から

    "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js --public 9f32ghd72d0ab34ed39ha63jdc5aya63hc.vfs.cloud9.ap-southeast-1.amazonaws.com",

と書き換えてください。

public以降の「9f32ghd72d0ab34ed39ha63jdc5aya63hc」はお持ちのCloud9の「C9_PID」を入力。
「ap-southeast-1」のところは現在私のシンガポールリージョンとなっているため、ご自身の設定しているリージョンのコードを登録してください。

以下も参考になると思います。
【AWS Cloud9】C9_PIDの出力方法 - Laravelとねころっけくん5.8

上記の書き換えが終わったらディレクトリ移動からの起動で完了するかと思います。

$ cd my-vuecli-app2
$ npm install vue-router //vue-routerを使用するなら
$ npm run dev

参考になった記事

cloud9でvue-cli 3 環境構築 - Qiita
AWS Cloud9上でwebpack-dev-serverでデバッグしようとするとInvalid Host header - Qiita

別のアプローチで解決できそうな記事

webpack-dev-serverで起動したアプリをlocalhostではなく0.0.0.0で外部に公開する方 | tackeyy.com