Angular Browsersync+；网页包

我想在手机/平板电脑上测试我的应用程序，但我无法通过任何方式访问它。我正在使用webpack dev server为我的应用程序提供服务，但希望通过browsersync与其他设备进行访问。有什么问题？页面正在加载，毕竟我得到了“错误连接超时”。这是angular2应用程序（如果有帮助的话）

webpack.config.js

const webpack = require('webpack');
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const BrowserSyncPlugin = require('browser-sync-webpack-plugin');

module.exports = {
    entry: path.join(__dirname, './src/app.module.ts'),
    output: {
        path: path.join(__dirname, './dist/'),
        filename: 'bundle.js'
    },
    devtool: 'source-map',
    module: {
        rules: [
            {
                test: /\.js$/,
                exclude: /(node_modules)/,
                use: {
                    loader: 'babel-loader',
                    options: {
                        presets: ['env'],
                        plugins: ['transform-runtime']
                    }
                }
            },
            {
                test: /\.ts$/,
                include: path.resolve(__dirname, 'src'),
                loader: 'ts-loader'
            },
            {
                test: /\.scss$/,
                include: path.resolve(__dirname, 'src'),
                use: [
                    { loader: 'style-loader' },
                    { loader: 'css-loader' },
                    { 
                        loader: 'postcss-loader',
                        options: {
                            plugins: function () {
                                return [
                                    require('autoprefixer')
                                ];
                            }
                        }
                    },
                    { loader: 'sass-loader' }
                ]
            },
            {
                test: /\.(jpe?g|png|gif|svg)$/i,
                loaders: [
                    'file-loader?hash=sha512&digest=hex&name=[hash].[ext]',
                    'image-webpack-loader?bypassOnDebug&optimizationLevel=7&interlaced=false'
                ]
            }
        ]
    },
    resolve: {
        extensions: ['.js', '.ts']
    },
    plugins: [
        new BrowserSyncPlugin({
                host: 'localhost',
                port: 3000,
                proxy: 'http://localhost:3100/'
            },
            {
                reload: false
            }
        ),
        new HtmlWebpackPlugin({
            template: path.join(__dirname, './src/index.html'),
        }),
    ]
};

package.json

{
"name": "translation",
  "version": "0.0.1",
  "description": "translations ( using i18n )",
  "main": "index.js",
  "scripts": {
    "start": "webpack --progress",
    "serve": "webpack-dev-server --progress"
  },
  "repository": {
    "type": "git",
    "url": "http://git.krakow.comarch/rnd/translation-i18n"
  },
  "author": "K.N.",
  "license": "ISC",
  "dependencies": {
    "@angular/animations": "^4.0.2",
    "@angular/common": "~4.0.0",
    "@angular/compiler": "~4.0.0",
    "@angular/core": "~4.0.0",
    "@angular/forms": "~4.0.0",
    "@angular/http": "~4.0.0",
    "@angular/platform-browser": "~4.0.0",
    "@angular/platform-browser-dynamic": "~4.0.0",
    "@angular/router": "~4.0.0",
    "core-js": "^2.4.1",
    "reflect-metadata": "^0.1.10",
    "rxjs": "5.0.1",
    "zone.js": "^0.8.4"
  },
  "devDependencies": {
    "babel-core": "^6.24.0",
    "babel-loader": "^6.4.1",
    "babel-preset-env": "^1.2.2",
    "browser-sync": "^2.18.8",
    "browser-sync-webpack-plugin": "^1.1.4",
    "css-loader": "^0.27.3",
    "html-webpack-plugin": "^2.28.0",
    "image-webpack-loader": "^3.3.0",
    "node-sass": "^4.5.2",
    "postcss-loader": "^1.3.3",
    "sass-loader": "^6.0.3",
    "style-loader": "^0.16.1",
    "ts-loader": "^2.0.3",
    "typescript": "^2.2.2",
    "typings": "^2.1.0",
    "webpack": "^2.3.2",
    "webpack-dev-server": "^2.4.2"
  }
}

我不知道其他哪些文件应该给你。连我都不知道问题出在哪里。。谢谢你的帮助

更新

我已将此端口添加到防火墙：

道尔尼的意思是——任何

---

仍然不起作用-相同的结果：C

如果你的应用程序在

localhost:8080

上，那么我认为你应该使用：

 new BrowserSyncPlugin({
            host: 'localhost',
            port: 3000,
            proxy: 'http://localhost:8080/'
        },

---

您是否试图在

局域网中的其他设备上访问它？

？是的，相同的结果：/n您获得了

超时。

您是否打开了防火墙中

开发服务器的端口？

？请尝试实际上我可以通过webpack开发服务器（本地主机：8080）访问我的页面，问题只是browsersyncoh mate。非常感谢：）不客气，医生来了顺便说一句：还有一个问题。。我也在同一个地点。可以通过我的电脑访问此网站，但不能使用手机。在PC上，我输入localhost:3000（就像在控制台中一样），但对于外部，它是192.168.56.1:3000（就像在控制台中一样），但无法访问？问题是什么？通过

外部访问
是否在PC上工作？如果是，并且您的电脑和手机位于同一个wifi点上，那么它应该可以工作。如果没有，则可能是网络配置问题。我曾经在网络上使用proxy时遇到过这个问题，但幸运的是，我只是切换到了另一个，所以我仍然不知道到底是什么问题。OK，已经解决了。在主机中，我必须键入我的ip而不是本地主机。现在工作。：）