docker react 在本地主机中不起作用
我正在尝试使用 docker 运行我的 react 应用程序，当我运行容器时，一切似乎都很好，但我无法在 localhost(或 127.0.0.1)上访问它.这是我的配置:
I am trying to run my react app with docker, when I run the container, everything seems fine but I can't access it on localhost (or 127.0.0.1). Here is my configuration:
Dockerfile:
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
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
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
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,
}),
],
});
当我使用构建时一切都很好
Everything is fine when I build by using
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
The terminal looks fine but I can not access to http://localhost:8090 or http://127.0.0.1:8090 or http://0.0.0.0:8090
任何帮助将不胜感激.
谢谢
我在 mac 上运行
推荐答案
如果这是你的容器的输出，那么你正在监听 localhost 在容器中，这与在主机上不同.让服务器监听 0.0.0.0 而不是 localhost (检查这篇文章) 然后尝试点击 localhost 在您的主机上.从外观上看，您也没有向主机公开任何端口，因此您还需要将 docker run 更改为类似于 docker run -p 8090:8090seyaa/客户端.
If that's the output from your container, then you're listening on localhost in the container, which is not the same as on the host. Make the server listen on 0.0.0.0 instead of localhost (check this post) then try hitting localhost on your host machine. You're also not exposing any ports through to your host by the looks of it, so you'll also need to change your docker run to be something like docker run -p 8090:8090 seyaa/client.
相关文章