はじめに
Cloud9でデフォルト設定のlocalhost
を使用するとアプリの動作確認が出来ません。1
他にもデフォルト設定のlocalhost
を使用する事で正常に起動しないものがあります。
それを解決する為の方法を記載します。
npm run dev
各パターンごとに方法を記載。基本的には記載された内容を実施した後npm run dev
を実行でOK。
##vue init webpack でテンプレートを作った場合
<ProjectName>/build/webpack.dev.conf.js
の一部分を下記の様に変更。
- const HOST = process.env.HOST
+ const HOST = '0.0.0.0'
/build/webpack.dev.conf.jsにdisableHostCheck: true,
を追加。
const devWebpackConfig = merge(baseWebpackConfig, {
.
.
.
// these devServer options should be customized in /config/index.js
devServer: {
+ disableHostCheck: true,
clientLogLevel: 'warning',
historyApiFallback: {
vue init nuxt/starter でテンプレートを作った場合
<ProjectName>/package.json
の一部分を下記の様に変更。
"scripts": {
- "dev": "nuxt",
+ "dev": "HOST=0.0.0.0 nuxt",
vue createでテンプレートを作った場合(Vue CLI 3)
プロジェクトのルートフォルダ直下にvue.config.js
を作成して、下記内容を登録。
module.exports = {
devServer: {
host: '0.0.0.0',
disableHostCheck: true
}
}
vue init pwa でテンプレートを作った場合
localhostでアプリが正常に起動した為、設定変更は不要。理由を調査する予定は無し。
Firebase
firebase login
firebase login --no-localhost
firebase serve
firebase serve -o $IP -p $PORT
-
localhost
はログイン中のPCの事であって、Cloud9上のマシンの事では無い為 ↩