docker react在localhost

时间:2018-02-25 18:53:55

标签: javascript reactjs docker dockerfile

我正在尝试使用docker运行我的反应应用程序,当我运行容器时,一切似乎都很好但我无法在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:8090http://127.0.0.1:8090http://0.0.0.0:8090

任何帮助都将不胜感激。

由于

编辑:我在Mac上运行

2 个答案:

答案 0 :(得分:2)

如果这是您容器的输出,那么您正在收听容器中的0.0.0.0 ,这与上的不同主机的。让服务器监听localhost而不是localhostcheck this post),然后尝试在主机上点击docker run。您也不会通过外观将任何端口暴露给您的主机,因此您还需要将docker run -p 8090:8090 seyaa/client更改为{access_token: "eyJhbGciOiJSUzI1NiIsInR5cCIgOiAiSldUIiwia2lkIiA6IC…GYRp73xtCuCE2VtNZqSC7C4N_sDsJoYt_9iaSgLDmpMv70cQw", expires_in: 300, refresh_expires_in: 1800, refresh_token: "eyJhbGciOiJSUzI1NiIsInR5cCIgOiAiSldUIiwia2lkIiA6IC…t-wfBBjgDoitwpiCZVykqZCT2mJvwdRmt1f8OlP7guqDLlJyg", token_type: "bearer", …} access_token : "eyJhbGciOiJSUzI1NiIsInR5cCIgOiAiSldUIiwia2lkIiA6ICJidFFTaGZBUDBpazVTTEFTOWZMRE4tbWxXZ3dvRnYwODVPZHpjSUJrWC13In0.eyJqdGkiOiIyODQ1ZWEwOC1kZDc5LTRiYjQtYTY2Ny03MDc3OTlkODVkMGEiLCJleHAiOjE1MTk1ODY2MDAsIm5iZiI6MCwiaWF0IjoxNTE5NTg2MzAwLCJpc3MiOiJodHRwOi8vbG9jYWxob3N0OjgwODAvYXV0aC9yZWFsbXMvZGVtbyIsImF1ZCI6ImFkbWluLWNsaSIsInN1YiI6IjNkYTY2MDYxLTQ2ZjUtNDZmYi1hNjllLTgwNGEzODkyMWQzMiIsInR5cCI6IkJlYXJlciIsImF6cCI6ImFkbWluLWNsaSIsImF1dGhfdGltZSI6MCwic2Vzc2lvbl9zdGF0ZSI6IjliODFkNWZjLTJkMjAtNDMzNS04MjViLWY3MTA5Mzc0MGVlNyIsImFjciI6IjEiLCJhbGxvd2VkLW9yaWdpbnMiOltdLCJyZXNvdXJjZV9hY2Nlc3MiOnt9LCJuYW1lIjoiUGllcnJlIENvbGFydCIsInByZWZlcnJlZF91c2VybmFtZSI6InBpZXJyZWNvbGFydCIsImdpdmVuX25hbWUiOiJQaWVycmUiLCJmYW1pbHlfbmFtZSI6IkNvbGFydCIsImVtYWlsIjoic2NhZHJhLTA4QGhvdG1haWwuY29tIn0.VceGd7ot7tWQfQ8uScegjcYz1gzOrdEE1som3-PMuyNumV_5qDn44omX3m64NGb5NgT7zgxX1QmeZyKH5i6AG9lG0lvM-u_8zp7tB4kd6i5oNSVQqiBSQmNK7k_Bk5DCIr72epI11W15ZbMYr2siumsTuO5qHkOApIarrgl9B0Cl_sTRMkIhO7S-CltmwkpynNHUEbafPC9bAKx83E4ADOlnlbZSIJnvvVr8aRQ_kAujTlRqRAEXweDkqPS05EFrOGifjKfKLZle3KdK31V0uT-gy2dZyjqflekKkGYRp73xtCuCE2VtNZqSC7C4N_sDsJoYt_9iaSgLDmpMv70cQw" expires_in : 300 not-before-policy : 0 refresh_expires_in : 1800 refresh_token : "eyJhbGciOiJSUzI1NiIsInR5cCIgOiAiSldUIiwia2lkIiA6ICJidFFTaGZBUDBpazVTTEFTOWZMRE4tbWxXZ3dvRnYwODVPZHpjSUJrWC13In0.eyJqdGkiOiIwOGUyNjc3ZC02YzNjLTQ5NGUtOGY4OC04MjBjNDk1M2Q5NjQiLCJleHAiOjE1MTk1ODgxMDAsIm5iZiI6MCwiaWF0IjoxNTE5NTg2MzAwLCJpc3MiOiJodHRwOi8vbG9jYWxob3N0OjgwODAvYXV0aC9yZWFsbXMvZGVtbyIsImF1ZCI6ImFkbWluLWNsaSIsInN1YiI6IjNkYTY2MDYxLTQ2ZjUtNDZmYi1hNjllLTgwNGEzODkyMWQzMiIsInR5cCI6IlJlZnJlc2giLCJhenAiOiJhZG1pbi1jbGkiLCJhdXRoX3RpbWUiOjAsInNlc3Npb25fc3RhdGUiOiI5YjgxZDVmYy0yZDIwLTQzMzUtODI1Yi1mNzEwOTM3NDBlZTciLCJyZXNvdXJjZV9hY2Nlc3MiOnt9fQ.JG51P9Dxv84jy4LZXuQau9kGS-YoXEfp1gc3CCqUDtM0uupoXN3-zGcrxFQ_0vHrqX4XHqI43aQWAmZtbznXtBOAPoVDkHXsZKnZxYLEag1b9y7aGHMr_psk6T5ckxiij1ge96XGIyn4mRyJgVUv28SOM1IcLb65HskvCmiI23NqE8kwtfKTvYv9DYYqD_eIV7lm4ePTeJiz2v70DEdK_dETR0eBSszabkurLZfjS-tAxC9buL7HE2ZdCATPCMj3mUxjllG329u1JRaEjJjX3nyyPJY_POUaKfkBnt-wfBBjgDoitwpiCZVykqZCT2mJvwdRmt1f8OlP7guqDLlJyg" session_state : "9b81d5fc-2d20-4335-825b-f71093740ee7" token_type : "bearer"

答案 1 :(得分:0)

必须先启动容器,然后才能在其中运行命令。

docker start seyaa/client

然后你可以运行eg。一个shell

docker run seyaa/client /bin/sh