无法访问由vagpack上的webpack-dev-server启动的网页

Question

从React和Flux架构开始,但遇到了一些基础设施问题.

我无法访问流浪盒(scotch-box)上webpack-dev-server启动的网页.该命令在localhost:3002上启动应用程序,我的vagrant box在Windows主机中有一个IP(192.168.33.10)地址,我可以访问它.但是当我尝试访问192.168.33.10:3002时,我收到错误:" 无法访问该页面...... "

我检查过我可以从流浪盒控制台访问页面curl http://localhost:3002.

有没有人有任何想法为什么会这样？

我也在使用es2015的babel和presets并做出反应.

这是webpack配置文件:

module.exports = {
    entry: "./src/js/main.js",
    output: {
        path: "./dist",
        filename: "bundle.js",
        publicPath: "/"
    },
    devServer: {
        inline: true,
        port: 3002,
        contentBase: "./dist"
    },
    module: {
        loaders: [
            {
                test: /\.jsx?$/,
                exclude: /(node_modules|bower_components)/,
                loader: "babel",
                query: {
                    presets: ["es2015", "react"]
                }
            }
        ]
    }
};

这是我的 package.json

{
  "name": "flux-jenezis",
  "version": "1.0.0",
  "description": "Flux realisatoin usign egghead guide",
  "main": "index.js",
  "scripts": {
    "start": "webpack-dev-server"
  },
  "keywords": [
    "flux",
    "react"
  ],
  "author": "jenezis",
  "license": "ISC",
  "dependencies": {
    "flux": "^2.1.1",
    "react": "^15.0.2",
    "react-dom": "^15.0.2",
    "react-router": "^2.4.0"
  },
  "devDependencies": {
    "babel-core": "^6.7.7",
    "babel-loader": "^6.2.4",
    "babel-preset-es2015": "^6.6.0",
    "babel-preset-react": "^6.5.0"
  }
}

UPD:我可以访问由节点服务器启动的不同应用程序,并且可以访问它们192.168.33.10:3002

UPD2:使用Windows默认工具进行网络诊断,诊断为:" 远程设备不接受连接 "

Answer 1

找到了解决方案.默认情况下webpack-dev-server运行应用程序localhost:<port>.要更改它,您可以运行webpack-dev-server使用此命令(通过传递--host选项):

webpack-dev-server --port 3000 --hot --host 0.0.0.0

0.0.0.0 绑定到所有主机.

我改变了我的package.json现在它看起来像:

{
  "name": "flux-jenezis",
  "version": "1.0.0",
  "description": "Flux realisatoin usign egghead guide",
  "main": "index.js",
  "scripts": {
    "start": "webpack-dev-server --host 0.0.0.0"
  },
  "keywords": [
    "flux",
    "react"
  ],
  "author": "jenezis",
  "license": "ISC",
  "dependencies": {    
    "flux": "^2.1.1",
    "react": "^15.0.2",
    "react-dom": "^15.0.2",
    "react-router": "^2.4.0"
  },
  "devDependencies": {
    "babel-core": "^6.7.7",
    "babel-loader": "^6.2.4",
    "babel-preset-es2015": "^6.6.0",
    "babel-preset-react": "^6.5.0"
  }
}