Подтвердить что ты не робот

Как развернуть node, который использует Gulp для героку

Я использую gulp, а также gulp плагины вроде gulp -minify-css, gulp -uglify и т.д. (которые указаны как зависимости npm для моего приложения).

Также я не фиксирую папку npm_modules и общую папку, где все сгенерированные файлы. И я не могу понять, как создать мое приложение (у меня есть команда gulp build) после развертывания и настройки моего сервера (он уже ищет общую папку).

Мне кажется, что плохая идея для фиксации перед загрузкой. Может быть, есть нежные решения... Любые мысли?

Forked from: Как развернуть приложение node, которое использует grunt для heroku

4b9b3361

Ответ 1

Мне удалось заставить это работать, добавив это в мой файл "package.json":

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

postinstall script запускается после сборки. Для получения дополнительной информации просмотрите this. Единственное, что раздражает то, что все ваши зависимости должны жить под "зависимостями" вместо того, чтобы иметь отдельные "devDependencies"

Мне не нужно было ничего делать с помощью buildpacks или конфигурации. Это похоже на самый простой способ сделать это.

Я написал о процессе, который я использовал здесь

Ответ 2

Вы можете это сделать!

Было несколько ключевых мер, которые помогли мне на этом пути:

  • heroku config:set NODE_ENV=production - настроить среду на "производство"
  • heroku config:set BUILDPACK_URL=https://github.com/krry/heroku-buildpack-nodejs-gulp-bower - включить настраиваемый пакет Heroku. Я включил элементы нескольких, чтобы сделать тот, который работал у меня.
  • A gulp задача под названием heroku:production, которая выполняет задачи сборки, которые должны выполняться на сервере heroku при создании NODE_ENV ===. Здесь моя:

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

    clean, build и minify являются, конечно, отдельными задачами gulp, которые выполняют магическую gulpage

  • Если ваше приложение находится в /app.js, либо:

    (A) сделать Procfile в корне проекта, который содержит только: web: node app.js или

    (B) добавьте начало script к вашему package.json:

    "name": "gulp-node-app-name",
    "version": "10.0.4",
    "scripts": {
      "start": "node app.js"
    },
    
  • И как @Zero21xxx говорит, поместите ваши модули gulp в свой обычный список зависимостей в package.json, а не в devDependencies, которые упускают из вида buildpack, который запускает npm install --production

Ответ 3

Самый простой способ найти:

  • Настройка gulp в package.json:

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

    Heroku запустит сборку перед запуском приложения.

  • Включить gulp в dependencies вместо devDevependencies, иначе Heroku не сможет его найти.

Более подробная информация об этом в Центре Heroku Dev: Рекомендации по Node.js Development

Ответ 4

Как развернуть в Heroku (или Azure) с помощью git-push

// 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

См. также

Ответ 5

Существует специальный запуск script, который предоставляет Heroku;

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

обратите внимание, что в вашем gulpfile.js(gulpfile.babel.js, если вы выполнили процесс сборки gulp), у вас должно быть имя задачи по умолчанию, которое будет автоматически запускаться после установки зависимостей через Heroku.

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

Ответ 6

Heroku обнаруживает, что в вашем проекте есть gulpfile и ожидает, что там будет heroku: production задача (в gulpfile). Итак, все, что вам нужно сделать, это зарегистрировать задачу, которая соответствует этому имени:

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

Этого достаточно, чтобы герой не отклонил ваше приложение.

Ответ 7

Мне нужно было немного поработать, потому что я использую browsersync:

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. Мне не нужно было устанавливать postinstall script.

Ответ 8

Это возможно, чтобы связать любую команду, которую вы хотите, поверх верхней части установки npm. Как и связанный с вами вопрос в вашем сообщении, вы можете добавить директиву установки в сценарии в пакете .json, который будет запущен после того, как все node депо были установлены, что делает сборку.

Ваша основная проблема будет сортировать правильные относительные пути для всего.

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