如何使端口80上运行的WebPack开发服务器和0.0.0.0，以让公众查阅？如何使端口80上运行的

我是新来的整个的NodeJS / reactjs世界如此道歉，如果我的QS听起来很愚蠢。 所以我玩弄这个reactjs应用在这里： https://github.com/bebraw/reactabular

每当我做一个“故宫开始”，它始终运行在localhost：8080

如何更改它在0.0.0.0:8080运行让公众查阅？ 我一直在试图读取上述回购的源代码，但未能找到它做到这一点的设置文件。

另外要补充的 - 我怎么让它在端口80上运行，如果这是在所有可能的？

谢谢。

Answer 1:

像这样的东西为我工作。 我猜这应该为你工作。

运行的WebPack-dev的使用这个

webpack-dev-server --host 0.0.0.0 --port 80

而在webpack.config.js设置此

entry: [
    'webpack-dev-server/client?http://0.0.0.0:80',
     config.paths.demo
 ]

注意：如果您使用的热负荷，你将不得不这样做。

运行的WebPack-dev的使用这个

webpack-dev-server --host 0.0.0.0 --port 80

而在webpack.config.js设置此

entry: [
    'webpack-dev-server/client?http://0.0.0.0:80',
    'webpack/hot/only-dev-server',
     config.paths.demo
 ],

....
plugins:[new webpack.HotModuleReplacementPlugin()]

Answer 2:

这是我如何做它，它似乎工作得很好。

在你webpack.config.js文件中添加以下内容：

devServer: {
    inline:true,
    port: 8008
  },

很明显，你可以使用不与其它冲突的任何端口。 我只提，因为我花了大约4小时的冲突问题。 战斗的问题才发现，我的服务是相同的端口上运行。

Answer 3:

配置用的WebPack（在webpack.config.js）：

devServer: {
  // ...
  host: '0.0.0.0',
  port: 80,
  // ...
}

Answer 4:

我是新来的JavaScript开发和ReactJS。 我无法找到适合我的答案，直到通过观察反应的脚本代码计算出来。 使用使用ReactJS 15.4.1+反应的脚本，你可以通过使用环境变量自定义主机和/或端口启动：

HOST='0.0.0.0' PORT=8080 npm start

希望这有助于新人和我一样。

Answer 5:

下面为我​​工作 -

1）在Package.json补充一点：

"scripts": {
    "dev": "webpack-dev-server --progress --colors"
}

2）在webpack.config.js您导出添加此配置下的对象：

devServer: {
    host: "GACDTL001SS369k", // Your Computer Name
    port: 8080
}

3）现在，在终端类型： npm run dev

4）在＃3编译并准备只是头部到您的浏览器并输入地址http://GACDTL001SS369k:8080/

你的应用程序应该有希望被与其他人可以在同一网络上访问外部URL现在的工作。

PS： GACDTL001SS369k是我的计算机名所以不要与任何是你你的机器上进行更换。

Answer 6:

如果你在“创造反应的应用程序内”创建一个应用程序做出反应是去你package.json和变化

"start": "react-scripts start",

到...（UNIX）

"start": "PORT=80 react-scripts start",

或...（WIN）

"start": "set PORT=3005 && react-scripts start"

Answer 7:

继JSON配置文件为我工作：

"scripts": {
  "start": "webpack-dev-server --host 127.0.0.1 --port 80 ./js/index.js"
},

Answer 8:

我尝试了上述解决方案，但没有运气。 我注意到在我的项目的package.json这一行：

 "bin": {
"webpack-dev-server": "bin/webpack-dev-server.js"

}，

我看着bin/webpack-dev-server.js ，发现这一行：

.describe("port", "The port").default("port", 8080)

我改变了端口3000蛮力方法的一点，但它为我工作。

Answer 9:

我挣扎着一些其他的答案。 （我的设置是：我运行npm run dev ，用的WebPack 3.12.0，使用创建我的项目后vue init webpack 。VirtualBox的18.04 Windows下的Ubuntu我有无业游民配置为转发端口3000到主机。）

• 不幸的是把npm run dev --host 0.0.0.0 --port 3000没有工作---它仍然运行在localhost：8080。
• 此外，该文件webpack.config.js并不存在，创建它没有帮助。
• 然后我发现现在的配置文件位于build/webpack.dev.conf.js （和build/webpack.base.conf.js和build/webpack.prod.conf.js ）。 然而，它看起来并不像一个好主意，修改这些文件，因为他们实际上读的主机和端口process.env 。

所以，我搜索关于如何设置process.env变量 ，并通过运行以下命令取得了成功：

HOST=0.0.0.0 PORT=3000 npm run dev

这样做后，我终于得到“你的应用程序运行在这里： http://0.0.0.0:3000 ”，我终于能够通过浏览看到它localhost:3000从主机。

编辑：找到另一种方式来做到这一点是通过编辑开发主机和端口config/index.js 。

Answer 10:

对我来说：改变听主持人的工作：

.listen(3000, 'localhost', function (err, result) {
        if (err) {
            console.log(err);
        }
        console.log('Listening at localhost:3000');
    });

改为：

.listen(3000, '0.0.0.0', function (err, result) {
        if (err) {
            console.log(err);
        }
        console.log('Listening at localhost:3000');
    });

和服务器启动监听0.0.0.0

文章来源: How to make the webpack dev server run on port 80 and on 0.0.0.0 to make it publicly accessible?