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


104

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


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
Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.