Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
1
Help us understand the problem. What is going on with this article?
@y-w

macOSのlocalhostへParallels(Windows 10)内のブラウザからアクセスする方法(webpack-dev-serverの場合)

More than 1 year has passed since last update.

バージョン

  • Parallels Desktop 15

共通手順

  1. 開発用サーバーのIPアドレスを0.0.0.0に固定する
  2. ParallesのWindows10構成>ハードウェア>ネットワークのソースを共有ネットワーク(推奨)に設定
  3. macのターミナルでifconfigと入力し、vnic0の項目でinetの隣の値をコピー(大抵は10.211.55.2)
  4. Windows 10よりブラウザでhttp://10.211.55.2:[ポート番号]へアクセス

webpack-dev-serverの設定

以下の設定でIPアドレスを設定。

webpack.config.js

module.exports = {

//中略

devServer: {
    host:'0.0.0.0',
    disableHostCheck: true
}

//中略

};

またはnpm scriptsに以下のように書いても同じ。

webpack-dev-server --host 0.0.0.0 --disable-host-check

ブラウザでIPアドレスを入力する手間を省く設定

  1. Windows 10のメモ帳を管理者権限で開く
  2. ファイル>開くからSystem32>drivers>etc>hosts.を開く(すべてのファイルに切り替えておく)
  3. ifconfigでコピーしたアドレスを貼り付けて隣に適当なドメインを書く(localhost.macなど)
hosts.
10.211.55.2 localhost.mac

参考記事

1
Help us understand the problem. What is going on with this article?
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
y-w
https://twitter.com/YuhtaW

Comments

No comments
Sign up for free and join this conversation.
Sign Up
If you already have a Qiita account Login
1
Help us understand the problem. What is going on with this article?