Публикация приложения Angular 2 (развертывание)

Наконец, я закончил сложную часть моего приложения angular 2, и я хочу увидеть его вживую на сервере.

У меня есть веб-хостинг на Linux. Я размещаю сайты на PHP и SQL, и мне интересно, как я могу разместить приложение angular 2, так как я запускаю его с помощьюnpm start.

Кто-то рассказал мне об Amazon EC2, но я не уверен, как он работает, так как это мой первый хостинг такого приложения.

Я прочитал это:О публикации приложения Angular 2 и заметил, что мне нужно скомпилировать мое приложение с JSPM (?) и как-то использовать его. Поэтому я попытался использовать это. это созданоjspm_packages папка в корне моего приложения, но я понятия не имею, что это значит и как его использовать.

Любая помощь, как опубликовать мое приложение с помощью веб-хостинга или Amazon EC2 / Любой другой способ, которым я могу позволить другим людям видеть и использовать мое приложение? Мое приложение - Angular2 и Laravel в качестве бэкэнда.

Ответы на вопрос(2)

На самом деле здесь есть два шага:

Упакуйте свое приложение с Gulp или другими инструментами, такими как Webpack / JSPM. Смотрите этот вопрос в случае с Gulp:Как на самом деле развернуть приложение Angular 2 + Typescript + systemjs?Загрузите соответствующие файлы в статический веб-сервер.

На втором этапе сервер может быть размещен на EC2, например. Но вы можете заметить, что вы можете даже разместить его на Github с помощью gh-страниц. Я думаю, что эта ссылка может помочь вам:https://gist.github.com/chrisjacob/833223, На самом деле это зависит от ваших потребностей ...

 TheUnreal03 июн. 2016 г., 16:39
Спасибо, но какой именно файл мне нужно загрузить на мой сервер? В вашем руководстве я создал папку dist сapp.min.js, vendor и index.html. мне нужно проглотить их снова после каждого обновления файла .ts?
 Thierry Templier03 июн. 2016 г., 17:31
Вам необходимо загрузить содержимоеdist папка. Да, вам нужно снова выполнять gulp после каждого обновления ...

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

Следующийэта ссылка с некоторыми изменениями я сделал, чтобы избежать/usr/bin/env: node: No such file or directory вопросы, я добавил следующий скрипт

.ebextensions/angular2deployment.config

files:
  "/opt/elasticbeanstalk/env.vars" :
    mode: "000775"
    owner: root
    group: users
    content: |
      export NPM_CONFIG_LOGLEVEL=error
      export NODE_PATH=`ls -td /opt/elasticbeanstalk/node-install/node-* | head -1`/bin
  "/opt/elasticbeanstalk/hooks/appdeploy/pre/50npm.sh" :
    mode: "000775"
    owner: root
    group: users
    content: |
      #!/bin/bash
      . /opt/elasticbeanstalk/env.vars
      function error_exit
      {
        eventHelper.py --msg "$1" --severity ERROR
        exit $2
      }

      #install not-installed yet app node_modules
      if [ ! -d "/var/node_modules" ]; then
        mkdir /var/node_modules ;
      fi
      if [ -d /tmp/deployment/application ]; then
        ln -s /var/node_modules /tmp/deployment/application/
      fi

      OUT=$([ -d "/tmp/deployment/application" ] && cd /tmp/deployment/application && $NODE_PATH/node $NODE_PATH/npm install 2>&1) || error_exit "Failed to run npm install.  $OUT" $?
      echo $OUT
  "/opt/elasticbeanstalk/hooks/configdeploy/pre/50npm.sh" :
    mode: "000666"
    owner: root
    group: users
    content: |
       #no need to run npm install during configdeploy
удалятьnode_modules & dist Папка, если у вас есть, оба не нужны.Бежатьnpm install && npm start (этот шаг должен быть успешным), обратите внимание, что я использую по умолчанию angular2package.json См. Angular.IO РазвертываниеЕсли № 3 успешно, то вы можете повторно удалитьnode_modules сноваВыберите Все файлы и папки в проекте (убедитесь, что.ebextensions также выбран), а затем сжимайте их, не сжимайте верхнюю папку (при развертывании у вас будет подкаталог, который нарушит развертывание)Теперь вы можете развернуть этот сжатый файл и наслаждаться!

Если вы используете MacOS, при сжатии macos добавит папку macos, которая нарушит развертывание, убедитесь, что вы используете инструмент, который не добавит этот дополнительный каталог, в моем случае я использовалYemuZip

Дополнительное примечание: будет работать эластичный бобовый стебель EC2npm install & npm startИменно поэтому я бы порекомендовал запустить их и убедиться, что они подходят для вашей локальной среды

Ваш ответ на вопрос