Gulp / NPM Dev依赖项 - 我的网站完成后如何处理它们?

问题描述 投票:0回答:1

我已经开始学习Gulp和Webpack了,其中一个教程没有涉及到......当你的项目完成并准备好部署时 - 你对所有dev依赖项做了什么?

node_modules文件夹本身很大,我假设你没有把它上传到你的web服务器(或者你可能这样做)?但这是否意味着您使用SASS / minification之类的所有好处只能在您的localhost项目中获得,因此它只是部署完成的文件(这意味着必须在网站上编辑缩小的代码等)如果你需要做任何小改动)。

学习过程的这一部分比在Web开发中迄今为止我所经历的任何其他信息更难找到信息。我也认为它很差,没有一个主要的学习库(Lynda,Treehouse等)在教程结尾处覆盖了这一点。就像,祝贺你现在建立了一个你可以上传的网站。好的,但我如何处理所有依赖项中的数百个文件等?我是否正常上传它们作为网站的一部分,如果没有,我该如何防止这种情况或npm是否自动阻止这种情况?

任何指导/解释都会很棒。

艾米莉

node.js npm deployment webpack gulp
1个回答
5
投票

部署项目有许多不同的方法。它所基于的技术,团队规模,项目规模,项目重要性和许多其他因素是决定如何完成的重要因素。我无法深入研究它在大项目中是如何完成的,因为这本身就是一个完整的领域,但我可以给你一些关于如何开始的指示。

部署代码时,通常可以选择四种策略:

  1. 在部署期间在服务器上构建。
  2. 在部署和部署node_modules和生产文件之前构建。
  3. 在部署之前构建并仅部署生产文件。
  4. 使用容器部署。

Build on the server

使用此策略,您可以将存储库中的所有内容上载到服务器。存储库我指的是您的源代码仓库,而不是整个项目文件夹。忽略的文件和文件夹(在.gitignore中,如果您正在使用git)不会上传,这意味着您不上传node_modules或gulp build文件。我假设您没有使用版本控制跟踪这些文件和文件夹。上传文件后,在服务器上运行npm install --only = production和gulp。

在启用生产模式的情况下运行npm install时,它仅下载并安装依赖项。 devDependencies被跳过。您可能想知道如何在不安装的情况下运行gulp。那么,你必须将所有与gulp相关的模块移动到依赖项部分。您在gulpfile中使用的模块也是如此,例如babel和webpack。

该应用程序应设置为提供由gulp制作的文件。如果您正在使用Express并且gulp make文件位于名为dist的文件夹中,则它看起来像这样:

app.use(express.static(path.join(__dirname, 'dist')));

当您使用AWS Elastic Beanstalk或Heroku等托管云提供程序时,此构建过程通常会自动生成。例如,要部署到Heroku,可以将repo中的分支推送到Heroku上的远程存储库。然后Heroku将自动运行npm install,然后运行您在package.json中定义的postinstall脚本。如果您将postinstall脚本设置为以下内容:

"scripts": {
  "start": "node app.js",
  "postinstall": "gulp"
}

当您推动更改时,它会自动为您运行gulp。然后,工作流程包括在本地进行更改,提交代码并将更改推送到Heroku。 Heroku将处理npm和gulp的东西。它还将在构建完成后重新启动应用程序。 Elastic Beanstalk与此类似。

我会推荐这个策略。它适用于持续集成。 AWS和Heroku也有免费的层级,因此您可以根据需要在那里进行实验。

Build before deploying and upload both node_modules and production files

您还可以选择在部署之前构建所有内容。上面提到的构建过程有两个步骤:在服务器上运行npm install以创建node_modules,然后在服务器上运行gulp以创建生产文件。

对于这个策略你

  1. 在工作文件夹(本地)内运行gulp以创建生产文件。
  2. 将生产文件以及package.json复制到新文件夹中。
  3. 在新文件夹中运行npm install --only = production以创建node_modules。
  4. 确保应用程序在新文件夹中工作,然后将其上载到服务器。

在这种情况下,您不在服务器上运行npm install或gulp。相反,您提供了所需的所有文件。我不认为我曾经见过这样做过。它与我提到的托管服务提供商不兼容,因为他们想自己运行npm install。

Build before deploying and upload only production files

如上面的策略所述,在部署期间未在服务器上运行npm install并不常见。但是,跳过gulp-on-server步骤是很常见的。不要将所有gulp模块都放在依赖项中,而是将它们保存在devDependencies中。你现在:

  1. 在本地运行gulp以创建生产文件。
  2. 将生产文件以及package.json复制到新文件夹中。
  3. 将新文件夹上载到服务器。
  4. 确保在服务器上运行npm install --only = production。

例如,使用Elastic Beanstalk非常容易。您所要做的就是上传一个包含生产文件和package.json的zip文件,它将在上传完成后自动为您运行npm install。它还将在安装完成后启动应用程序。

Using containers

此策略使用Docker等技术创建一个容器,其中包含运行Node所需的所有内容。这意味着OS,Node,npm,您的代码等。然后,您将容器上传到接受容器的托管解决方案,例如AWS。这不是很难,但我会建议你先习惯“普通”的部署方法。


您提到对服务器上的代码进行小的更改。我建议你不要这样做。您应该在本地编辑代码,然后确保它在本地服务器上运行,最后在提交后上载更改。您的回购应该反映实时代码。

最后,我建议您在Heroku或AWS或两者上创建帐户。只是搞乱它,看看它是如何工作的,这通常是最好的学习方式。它是免费的,你不能破坏任何东西。

© www.soinside.com 2019 - 2024. All rights reserved.