Как опубликовать сайт, созданный на Node.js, на Github Pages?

104

Я сделал сайт, используя Node.js в качестве сервера. Насколько я знаю, файл node.js должен начать работать с ввода команд в терминале, поэтому я не уверен, поддерживает ли Github Pages хостинг node.js. Так что я должен делать?

dyzdyz010
источник
2
Взгляните также на github.com/assemble/assemble , это генератор статических сайтов на основе grunt.js. В основном вы просто запускаете, grunt assembleзатем git commit и нажимаете на ветку gh-pages, и все готово.
jonschlinkert 04
Heroku может помочь вам heroku.com
Ахраф

Ответы:

104

На страницах GitHub размещаются только статические HTML-страницы. Серверные технологии не поддерживаются, поэтому приложения Node.js не будут работать на страницах GitHub. Есть много хостинг - провайдеров, которые перечислены на вики Node.js .

Туман приложений кажется наиболее экономичным, поскольку он предоставляет бесплатный хостинг для проектов с 2 ГБ оперативной памяти (что, если вы спросите меня, неплохо).
Как указано здесь , AppFog удалил бесплатный тарифный план для новых пользователей.

Если вы хотите разместить статические страницы на GitHub, прочтите это руководство . Если вы планируете использовать Jekyll , это руководство будет вам очень полезно.

Акшат Дживан Шарма
источник
1
Что насчет этого примера ?: idflood.github.io/ThreeNodes.js/public/index.html . Что находится на Node.js, если вы посмотрите на код: github.com/idflood/ThreeNodes.js
Лилиан А. Морару
5
@ LilianA.Moraru Это страница проекта. Для страниц проекта должна быть создана специальная ветка под названием gh-pages. Взгляните на ветку репозитория gh-pages. Она содержит чистые html файлы. Так что все, что вы видите на ссылка фактически из ветки gh-pages.
Акшат Дживан Шарма
Кстати, хорошее репо.
Акшат Дживан Шарма
@Akshat_Jiwan_Sharma Вы правы. Это тоже то, что я знал, но сегодня я увидел этот сайт на github и подумал, что вы действительно можете использовать Node.js. Я не заметил, что это просто хранилище в организации. Если бы это была сама организация, то она была бы в главном филиале ...
Лилиан А. Морару
1
repl.it теперь поддерживает бесплатный хостинг приложений, хотя я не уверен, сколько у него памяти и даже как подключить его к репозиториям Git. Однако это может быть полезно для небольших проектов.
Нил Чоудхури
32

Нам, любителям Javascript, необязательно использовать Ruby (Jekyll или Octopress) для создания статических страниц на страницах Github, мы можем использовать Node.js и Harp , например:

Это шаги . Аннотация:

  1. Создать новый репозиторий
  2. Клонировать репозиторий

    git clone https://github.com/your-github-user-name/your-github-user-name.github.io.git
  3. Инициализировать приложение Harp (локально):

    harp init _harp

не забудьте указать папку с подчеркиванием в начале; при развертывании на страницах GitHub вы не хотите, чтобы исходные файлы обслуживались.

  1. Скомпилируйте свое приложение Harp

    harp compile _harp ./
  2. Развернуть в Gihub

    git add -A
    git commit -a -m "First Harp + Pages commit"
    git push origin master

И это классное руководство с подробностями о таких хороших вещах, как макеты, частичные файлы, Jade и Less.

Иоганн Эчаваррия
источник
3
Я любитель рубинов, но я немного обману его. Комбинация арфа + гугл-страничка потрясающая !!!
Alter Lagos
3
Будьте осторожны при установке арфы на уже существующий проект!
Mehul Tandale 01
1

Мне удалось настроить действия github для автоматической фиксации результатов команды сборки узла ( yarn buildв моем случае, но она также должна работать с npm) в gh-pagesветку всякий раз, когда новая фиксация отправляется в мастер.

Хотя это не совсем идеально, поскольку я бы хотел избежать фиксации созданных файлов, похоже, что в настоящее время это единственный способ публикации на страницах github.

Я основывал свой рабочий процесс на этом руководстве для другой библиотеки реагирования, и мне пришлось внести следующие изменения, чтобы заставить его работать на меня:

  • обновил шаг «узел настройки», чтобы использовать версию, найденную здесь, поскольку версия из образца, на котором я его основывала, выдавала ошибки, потому что не могла найти правильного действия.
  • удалите строку, содержащую, yarn exportпотому что эта команда не существует и, похоже, не добавляет ничего полезного (вы также можете изменить строку сборки над ней в соответствии с вашими потребностями)
  • Я также добавил envдирективу к yarn buildшагу, чтобы я мог включить хэш SHA коммита, который сгенерировал сборку внутри моего приложения, но это необязательно

Вот мое полное действие на github:

name: github pages

on:
    push:
        branches:
        - master

jobs:
    deploy:
        runs-on: ubuntu-18.04
        steps:
        - uses: actions/checkout@v2

        - name: Setup Node
            uses: actions/setup-node@v2-beta
            with:
            node-version: '12'

        - name: Get yarn cache
            id: yarn-cache
            run: echo "::set-output name=dir::$(yarn cache dir)"

        - name: Cache dependencies
            uses: actions/cache@v2
            with:
            path: ${{ steps.yarn-cache.outputs.dir }}
            key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
            restore-keys: |
                ${{ runner.os }}-yarn-
        - run: yarn install --frozen-lockfile
        - run: yarn build
            env:
            REACT_APP_GIT_SHA: ${{ github.SHA }}

        - name: Deploy
            uses: peaceiris/actions-gh-pages@v3
            with:
            github_token: ${{ secrets.GITHUB_TOKEN }}
            publish_dir: ./build

Альтернативное решение

В документации для next.js также приведены инструкции по настройке с помощью Vercel, который, похоже, является службой хостинга для приложений node.js, аналогичных страницам github. Я не пробовал этого, поэтому не могу сказать, насколько хорошо это работает.

Моральный кодекс
источник
-27

Перенести приложение node js с локального компьютера на GitHub очень просто.

Шаги:

  1. Сначала создайте новый репозиторий на GitHub
  2. Откройте Git CMD, установленный в вашей системе (установите GitHub Desktop )
  3. Клонируйте репозиторий в вашу систему с помощью команды: git clone repo-url
  4. Теперь скопируйте все файлы вашего приложения в эту клонированную библиотеку, если ее там нет.
  5. Подготовьте все к фиксации: git add -A
  6. Зафиксируйте отслеживаемые изменения и подготовьте их к отправке в удаленный репозиторий: git commit -a -m "First Commit"
  7. Отправьте изменения в локальном репозитории на GitHub: git push origin master
ОЗУ
источник
16
Все, что вы сделали, это показали, как загружать файлы в репозиторий Github через git, сначала понять вопросы, прежде чем оставлять свои ответы, чтобы вы вносили значимый вклад в StackOverflow
Precious Tom
1
Вы совершенно неправильно поняли вопрос
Кристофер Томас
Неверный ответ, спрашивают не об этом
Mr_Hmp