如何将响应应用程序部署为单个文件?

时间:2017-11-07 05:26:40

标签: node.js reactjs web-deployment

我不熟悉React Web应用程序。但是,我必须构建并部署到服务器。

据其他人说,我必须这样......

  1. 使用tar压缩整个反应项目
  2. 将tar上传到服务器
  3. npm install - npm run compile(执行webpack.config.js中所述的某些操作) - npm start
  4. 然而,对我来说这看起来很奇怪。我们的java项目构建输出是60MB,但前端源几乎就像700MB。

    Added some extra opinion.
    The size of  the project is...
    
    - original node project
    - include webpack output directory
    - npm module directory and build directory
    
    Anyway, I can not get why do I still need the original source code?
    I already have build output file
    

    此外,为什么目标服务器中应该npm install? - 所以我认为这(使用tar)不是部署反应式Web应用程序的好方法。

    所以我想知道正确的部署方式。 谢谢!

2 个答案:

答案 0 :(得分:0)

对我来说,从create-react-app生成的脚手架代码开始效果很好。您可能想要使用它   - https://github.com/facebookincubator/create-react-app

我也不清楚为什么前端会是“700”MB。假设您正在构建单个页面应用程序或类似应用程序,开发和部署工作流程看起来类似于 -

  1. 开发
    • 在开发计算机上安装节点(最终安装npm)。
    • 使用npm安装create-react-app。
    • 使用'create-react-app'命令行创建一个反应应用。
    • 从app-directory内部发出命令'npm start'以启动为您的应用程序提供服务的开发服务器。
    • 更改源代码以构建您的应用。
  2. 部署
    • 当应用程序部署就绪时。从app目录中,给出命令'npm run build'在可配置的构建目录中创建可供使用的文件(通常是 - build)。
    • 要部署压缩和/或分发目录本身。
  3. 这里需要注意的一点是,您不需要node和/或npm来运行构建的源代码。在开发应用程序时需要它们。原因主要是因为构建过程会创建一个包含应用程序所需的所有JS和包的包。此外,至少在部署时,您不必担心像web-pack等任何事情。

    一些引用(礼貌:谷歌)指向正确的方向 -

答案 1 :(得分:0)

我不知道您的确切设置,但最常见的方法是在本地构建应用程序并将编译后的文件推送到服务器。 Webpack将所有内容编译在单个文件中,并依赖于您的应用程序和Webpack配置,它将把它保存在一个JavaScript文件中。

最后,您只需要一个可以提供静态文件的网络服务器。因此,无需运行npm start,这大部分时间都是开发服务器。