javascript - docker react不适用于本地主机

Question

我正在尝试使用docker运行我的react应用程序，当我运行容器时，一切似乎都很好，但是我无法在localhost(或127.0.0.1)上访问它。这是我的配置:

Dockerfile:

FROM node:carbon

RUN mkdir -p /usr/src/app

WORKDIR /usr/src/app

COPY package.json /usr/src/app

RUN npm install

COPY . /usr/src/app

EXPOSE 8090

CMD ["npm", "run", "start-test"]

package.json

"start-test": "./node_modules/webpack-dev-server/bin/webpack-dev-server.js --config webpack.dev.config --inline --hot --history-api-fallback --port 8090 --public localhost:8090 --host 0.0.0.0"

webpack.common.js

const path = require('path');
const CleanWebpackPlugin = require('clean-webpack-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const webpack = require('webpack');

module.exports = {
  entry: {
    app: [
      // 'react-hot-loader/patch',
      'babel-polyfill',
      path.join(__dirname, 'src', 'index.js'),
    ],
  },
  output: {
    filename: '[name].bundle.js',
    path: path.resolve(__dirname, 'dist'),
    publicPath: '/',
  },
  module: {...},
  plugins: [
    new CleanWebpackPlugin(['dist']),
    new HtmlWebpackPlugin({
      template: './src/index.html',
      title: 'Production',
      // hash: true,
      filename: './index.html',
    }),
    new webpack.NamedModulesPlugin(),
  ],
  resolve: {
    extensions: [' ', '.js', '.jsx', '.json'],
    modules: [
      path.join(__dirname, 'src'),
      path.join(__dirname, 'node_modules'),
    ],
  },
};

webpack.config

module.exports = merge(common, {
  devtool: 'inline-source-map',
  devServer: {
    contentBase: './dist',
    disableHostCheck: true,
  },
  module: {
    rules: [
      {
        test: /\.scss$/,
        use: ['style-loader', 'css-loader', 'sass-loader'],
      },
    ],
  },
  plugins: [
    new ExtractTextPlugin({
      filename: 'app.css',
      disable: true,
    }),
  ],
});

当我使用构建时，一切都很好

docker build --no-cache . -t seyaa/client

然后我使用启动容器

docker run  seyaa/client

这是控制台的结尾

> redux-minimal@1.0.0 start-test /usr/src/app
> ./node_modules/webpack-dev-server/bin/webpack-dev-server.js --config webpack.dev.config --inline --hot --history-api-fallback --port 8090 --public localhost:8090 --host 0.0.0.0

clean-webpack-plugin: /usr/src/app/dist has been removed.
Project is running at http://localhost:8090/
webpack output is served from /
Content not from webpack is served from ./dist
404s will fallback to /index.html
Hash: 64fdd9746e89b58394d3
Version: webpack 3.11.0
Time: 13617ms

终端看起来不错，但我无法访问 http://localhost:8090或 http://127.0.0.1:8090或 http://0.0.0.0:8090

任何帮助，将不胜感激。

谢谢

编辑:我在Mac上运行

Answer 1

如果这是容器的输出，那么您正在侦听容器中的localhost，这与主机上的不同。使服务器侦听0.0.0.0而不是localhost(check this post)，然后尝试在主机上命中localhost。您也不会通过它的外观公开任何通过主机的端口，因此您还需要将docker run更改为docker run -p 8090:8090 seyaa/client。