繁体   English   中英

Gulp将Node应用程序的dist文件夹部署到Heroku

[英]Gulp deploy dist folder of Node app to Heroku

我是node,git,github和Heroku的新手,我正在努力找出将我的应用程序发送到Heroku的最佳方式,而不会使用我编译的缩小应用程序混乱使用repo而不会在Heroku中做太多。

我的node.js项目看起来有点像这样:

- client
     ... code
- server
     ... code
- node_modules
- package.json
- gulpfile.js
- dist
    - client
    - server

node_modulesdist之外的所有内容都会进入github。

gulpfile编译,缩小和连接准备好在dist释放的所有内容。 如何将dist文件夹推送到Heroku,而不是将其放入github? 什么是最佳做法? 我宁愿不把我的gulpfile发送到Heroku,因为它意味着移动package.json中的devDependencies并使用post更新脚本,因为它将项目与Heroku联系起来比我想要的多。

在这两个帖子中总结了不使用post hook的原因: https//stackoverflow.com/a/15050864/344022&https//stackoverflow.com/a/21056644/344022 ,遗憾的是他们没有提供易于理解的替代方案。

Heroku现在有一个静态buildpack正在开发中来处理这个问题(参见https://github.com/heroku/heroku-buildpack-static

创建一个static.json文件以使用dist / with .html后缀中的文件并将所有调用重新路由回SPA

{
  "root": "dist/",
  "clean_urls": true,
  "routes": {
      "/**": "index.html"
  }
}

例如,扩展package.json脚本以确保构建dist /目录

"scripts": {
  ...
  "heroku-postbuild": "gulp"
}

这样就可以安装package.json中的dev依赖项了

heroku config:set NPM_CONFIG_PRODUCTION=false --app

多个构建包,以便您可以构建和部署

heroku buildpacks:add heroku/nodejs --app <app_name>
heroku buildpacks:add https://github.com/heroku/heroku-buildpack-static.git --app <app_name>

在这种情况下,您的procfile可以为空。

我有同样的问题,只将dist文件夹推送到heroku应用程序,现在我使用不同的方法,不确定闲置的,但它适用于我。 我创建了一个部署文件并添加了以下代码

  import {spawnSync} from 'child_process';

  function deploy(){ 
    options = {
      cwd: path.resolve(__dirname, './dist')
    };
    //push dist folder to deploy repo
    console.log('Initialising Repository');
    spawnSync('git',['init'],options);
    console.log('Adding remote url');
    spawnSync('git',['remote','add', remote.name, remote.gitPath],options)
    console.log('Add all files');
    spawnSync('git',['add','.','--all'],options)
    console.log(`Commit with v${version}`);
    spawnSync('git', ['commit','-m',`v${version}`], options)
    console.log('Push the changes to repo');
    spawnSync('git', ['push', '-f', remote.name, 'master'],options)
 }

package.json保存repo iformation并在这里阅读,我在webpack构建任务之后运行它。 所以这将把我的新版本推送到heroku。 即使dist中的.git被删除,它也会处理它。

继续,在heroku上设置一个post hook,为你构建app并将文件复制到他们将要服务的位置。 这是一种相当普通的做法,一旦设置完毕,您需要做的就是使用git push来部署您的应用程序,这非常方便。 另一种方法是使用一个单独的存储库,您可以手动将文件复制到其中并从中推送,但这对我来说似乎并不光滑,通过搞乱依赖关系或者忘记删除生成的文件而导致人为错误的可能性更大需要更久等

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM