如何将使用Gulp的节点部署到heroku

我正在使用gulp和gulp插件，比如gulp-minify-css，gulp-uglify等（我的应用程序被列为npm依赖项）。

另外我不提交npm_modules文件夹和公共文件夹，其中所有生成的文件。 我不知道如何构build我的应用程序（我有gulp生成命令）部署和设置我的服务器（它已经在寻找公共文件夹）。

上传前提交我似乎不是一个好主意。 也许有一些温和的决定…任何想法？

分叉： 如何将使用grunt的节点应用程序部署到heroku

Answer 1

我可以通过添加到我的“package.json”文件来得到这个工作：

"scripts": { "start": "node app", "postinstall": "gulp default" } 

构build包后运行postinstall脚本。 检查这个更多的信息。 唯一令人讨厌的是所有的依赖关系必须在“依赖关系”下生存，而不是单独的“devDependencies”

我不需要做任何其他的构build包或configuration。 这似乎是最简单的方法。

我写了我在这里使用的过程

Answer 2

你能行的！

有几个关键的措施帮助我一路走来：

1. heroku config:set NODE_ENV=production – 将您的环境设置为“生产”
2. heroku config:set BUILDPACK_URL=https://github.com/krry/heroku-buildpack-nodejs-gulp-bower – 启用自定义的Heroku buildpack。 我结合了几个元素来制作一个为我工作的元素。

3. 一个名为heroku:production任务，执行NODE_ENV ===生产时需要在heroku服务器上执行的生成任务。 这是我的：

    var gulp = require('gulp') var runSeq = require('run-sequence') gulp.task('heroku:production', function(){ runSeq('clean', 'build', 'minify') }) 

   clean ， build和minify ，当然是分开的gulp任务，做魔法的堵嘴

4. 如果您的应用程序位于/app.js ，则可以：

   （A）在仅包含web: node app.js或者

   （B）添加一个开始脚本到你的package.json ：

    "name": "gulp-node-app-name", "version": "10.0.4", "scripts": { "start": "node app.js" }, 

5. 和@ Zero21xxx一样，把你的gulp模块放在package.json的正常依赖列表中，而不是放在devDependencies中，这被buildpack忽略，它运行npm install --production

Answer 3

我发现的最简单的方法是：

1. 在package.json脚本区域设置gulp ：

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

   Heroku将在启动应用程序之前运行构build。

2. 包括dependencies而不是devDevependencies ，否则Heroku将无法find它。

有关Heroku开发中心的更多相关信息： Node.js开发的最佳实践

Answer 4

如何使用git-push部署到Heroku（或Azure）

 // gulpfile.js var gulp = require('gulp'); var del = require('del'); var push = require('git-push'); var argv = require('minimist')(process.argv.slice(2)); gulp.task('clean', del.bind(null, ['build/*', '!build/.git'], {dot: true})); gulp.task('build', ['clean'], function() { // TODO: Build website from source files into the `./build` folder }); gulp.task('deploy', function(cb) { var remote = argv.production ? {name: 'production', url: 'https://github.com/<org>/site.com', branch: 'gh-pages'}, {name: 'test', url: 'https://github.com/<org>/test.site.com', branch: 'gh-pages'}; push('./build', remote, cb); }); 

然后

 $ gulp build --release $ gulp deploy --production 

也可以看看

• https://github.com/koistya/git-push
• https://github.com/kriasoft/react-starter-kit（tools tools/deploy.js ）

Answer 5

Heroku提供了一个特定的启动脚本;

 "scripts": { "start": "nodemon app.js", "heroku-postbuild": "gulp" } 

请注意，在你的gulpfile.js（gulpfile.babel.js，如果你是es6-ifed你的gulp构build过程），你应该有一个默认的任务名，这个任务名将在Heroku安装依赖后自动运行。

https://devcenter.heroku.com/articles/nodejs-support#heroku-specific-build-steps

Answer 6

Heroku发现你的项目中有一个gulpfile文件，期望有一个heroku：生产 任务 （在gulpfile中）。 所以你所要做的就是注册一个与这个名字相匹配的任务：

 gulp.task("heroku:production", function(){ console.log('hello'); // the task does not need to do anything. }); 

这足以让heroku 不会拒绝你的应用程序。

Answer 7

我不得不采取稍微不同的工作，因为我正在使用浏览器同步：

的package.json

  "scripts": { "start": "gulp serve" } 

gulp.js

 gulp.task('serve', function() { browserSync({ server: { baseDir: './' }, port: process.env.PORT || 5000 }); gulp.watch(['*.html', 'css/*.css', 'js/*.js', 'views/*.html', 'template/*.html', './*.html'], {cwd: 'app'}, reload); }); 

将端口设置为环境端口对于防止在Heroku中部署时出现错误非常重要。 我不需要设置安装后脚本。

Answer 8

可以通过npm install的顶层来搭载任何你想要的命令。 与post中的链接问题非常相似，您可以在package.json中的脚本中添加一个安装指令，该指令将在安装完所有节点代码后运行。

你的主要问题将是整理出一切正确的相对path。

{ ... scripts:{ install: "YOUR GULP BUILD COMMAND" } ... }