Posted at

Vue.jsでSPAをした時にlocalhostからレスポンスがない


はじめに

Vue.jsでSPA(Single Page Application)を作る際にlocalhostからデータがこないエラーに遭遇しました。


開発環境

macOS High Sierra v10.13.6

npm v6.5.0


導入

https://qiita.com/567000/items/d6a7c694a370dc92e774

https://qiita.com/nagimaruxxx/items/8fc59a5ca05bb91bfe1f

ここらへんを参考にしました。


エラー内容

npm導入完了後に

$ npm install -g vue-cli

$ vue init webpack my-project
$ cd my-project
$ npm run dev

いざ、localhost!ってことで

http://localhost:8080/

で、繋がりません。

スクリーンショット 2019-01-21 17.25.40.png


解決策

my-project/config/index.jsのポート番号を書き換えて解決しました。

ポート番号の記述は私の環境では17行目にありました。

デフォルトで8080のところを8081に変更しました。

(使ってなければ他の番号でもいいと思います。)


my-project/config/index.js

:

host: 'localhost',
port: 8081,
:

解決策は以下で見つけました。

https://github.com/vuejs/vue-cli/issues/36


終わりに

初歩の初歩で詰まっていて泣きそうになっていましたがこの画面をみてホッとしました。

スクリーンショット 2019-01-21 18.13.55.png

お役に立てれば幸いです。