如何在 React JS 中通过静态服务器为应用程序提供服务时设置新端口

techie_questie

我有两个应用程序,我想在两个不同的端口上运行。我正在使用 webpack 将所有静态内容捆绑在一个 dist 文件夹中并运行静态服务器。静态服务器默认在 9080 上运行,第一个应用程序运行得非常好。但是,当我尝试运行第二个应用程序时,出现端口已在使用中的错误。所以我正在为另一个应用程序设置一个新的端口,以便它在该端口上提供服务。为此,我正在做类似下面的事情。在我的 package.json-

"scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "webpack-dev-server --hot  --config webpack.prod.js",
    "build": "webpack --config webpack.prod.js",
    "start:prod": "set PORT=3006 && cd dist && static-server"
  }

我无法将端口设置为 3006,而是当我尝试在列表文件夹中运行 status-server 时,出现错误 -

* Shutting down server

events.js:183
      throw er; // Unhandled 'error' event
      ^

Error: listen EADDRINUSE :::9080
    at Object._errnoException (util.js:1022:11)
    at _exceptionWithHostPort (util.js:1044:20)
    at Server.setupListenHandle [as _listen2] (net.js:1351:14)
    at listenInCluster (net.js:1392:12)
    at Server.listen (net.js:1476:7)
    at StaticServer.start (/usr/local/lib/node_modules/static-server/server.js:114:58)
    at Object.<anonymous> (/usr/local/lib/node_modules/static-server/bin/static-server.js:48:8)
    at Module._compile (module.js:643:30)
    at Object.Module._extensions..js (module.js:654:10)
    at Module.load (module.js:556:32)

我也尝试在我的 webpack.config.js 中设置端口,但仍然遇到同样的问题。有人可以让我知道我做错了什么。

马修斯

您应该将端口作为参数而不是环境变量提供给您的进程,例如:

static-server -p 8080

设置环境变量的一些注意事项

如果您使用的是基于 UNIX 的操作系统链接 macOS 或 Linux,则有多种方法可以设置环境变量:

  1. 如果您只想为后一个命令设置变量,则应以这种方式使用它

    PORT=8080 npm run dev.

  2. 如果你想为整个终端会话设置变量,你应该这样设置

    $ set -a $ PORT=8080 & yarn run dev

  3. 您可以将它添加到您的~/.zshrc/~/.bashrc ~/.profile以使其始终在您的终端中:

    export PORT=8080

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

如何在Apache服务器中运行Node.js应用程序

如何在Node.js服务器应用程序中运行C#?

如何在不同的端口上为我的 http 服务器提供 Angular 应用程序

如何在React JS中应用动画

如何在Node.js服务器上部署Vue.js应用程序

在Nginx服务器中未显示404的react.js应用程序

如何通过一台 Express 服务器部署不同的 React Web 应用程序?

当应用程序位于服务器的子目录中时,如何设置ember.js以使用历史记录

如何在服务器上部署Node Js后端和React Js前端?

如何在Scala.js React.js应用程序中处理大型js文件?

如何在React JS中渲染对象

如何在 React 中构建 js 对象

如何在React JS中更新状态

如何在 React JS 中修改 API?

如何在react js中安装tailwindcss

如何在React js中插入数据

如何在 React js 中评分星级?

如何在Express,React,Webpack,SSR应用程序中的客户端和服务器之间共享常量

当图像存储在node.js服务器上载文件夹中时,如何在角度应用程序中显示图像?

如何在使用docker的指定应用程序的服务器上查找css / js文件

如何在 Linux 服务器上部署 Node.js 和 MongoDB 应用程序

如何在 Node JS Azure 中使用 Expo 部署 React Native Web 应用程序 - 应用服务

如何在next.js应用程序中从服务器端获取客户端的IP地址?

如何将Heroku生成的服务器端口应用于前端Vue.js应用程序?

如何在react js中为地图项设置样式

如何从Spring Boot应用程序为React应用程序提供服务?

如何在Windows IIS中托管React.js和Node.js应用程序?

为使用 ConnectedRouter 制作的 React.JS 应用程序的 SSR 正确初始化服务器上的商店

如何在 Scala REST API 服务器上运行 React.js