Я новичок в Angular 2. Я смущен тем, как Angular 2 работает в производственной среде.Как развернуть приложение Angular 2, разработанное в машинописном машиностроении?
Каковы предпосылки для запуска приложения Angular 2 на рабочем сервере?
Возможно ли развертывание приложения на сервере IIS или требуется сервер узлов?
После компиляции файла в машине разработки с использованием узла нам нужно развернуть оба .js и .ts для производства?
Угловые 2 приложения написаны на TS, но браузер только понимает JavaScript в конце. Таким образом, любой проект TS переводится на первое событие JavaScript во время разработки.
Вы можете запускать угловое приложение на любом сервере.
Вам нужно только развернуть .js-файлы, так как браузер не будет анализировать файлы .ts.
Я использую JSPM, чтобы подготовить мои проекты для работы с угловыми2. Другие популярные инструменты, такие как JSPM, включают webpack и browserfy. Одной из важных задач, которые будет выполняться JSPM, является объединение различных модулей, составляющих ваш проект angular2. Я также установил флаг selfExecutingBundle в true и JSPM создаст один связанный js-файл (например, myApp.bundled.js), и оттуда я его миниатюру (myApp.bundled.min.js), и эта ссылка на сценарий используется в index.html.
<html>
<head>
<title>Hello Angular World</title>
</head>
<body>
<div>
<my-app>Loading...</my-app>
</div>
<script src="/js/myApp.bundle.min.js"></script>
</body>
</html>И это все, что вам нужно!
В будущем, когда спецификация HTTP/2 более распространена, может потребоваться расслоение ваших проектов на основе модулей, но на данный момент я считаю, что требуется объединение.
Нет ссылки на ваши машинописные файлы (поскольку они уже были переписаны в процессе создания myApp.bundled.js). Как сказал Зама, вы можете запускать angular2 на любом сервере (я использую IIS и отлично работает).
ОБНОВЛЕНИЕ: после окончательного выпуска Углового 2 я переключился на использование углового кли для строительства. Настройка проста (без спагетти задач с глотками), а окончательный пакет супер-оптимизирован (esp из-за дрожания дерева). Я рекомендую проверить angular-cli для настройки, разработки и создания ваших проектов ng2.
Существует много проектов стартового семестра, которые включают в себя возможность служить и строить ваш проект. Я использую (и очень доволен) https://github.com/antonybudianto/angular2-starter
Вы можете найти много других здесь: https://github.com/timjacobi/angular2-education#boilerplates
Всех машинопись файлов будет transpiled для JS-файлов при разработке приложения со стороны transpiler, так что вам не нужно ts в производстве.
Также, когда вы закончите разработку, все, что вам нужно сделать, это сделать комплект dist, используя какой-либо комплектный инструмент, например webpack-starter или .
Затем вы развертываете этот комплект на свой сервер.
Указанные выше пакеты содержат большой объем информации о том, как можно развернуть свое приложение angular2 для производства.
Надеюсь, что это поможет.
Это очень просто загрузить приложение на производство. шаги:
Можете ли вы поделиться более подробной информацией о последнем шаге? Например, если я хотел бы использовать tomcat, что я должен точно скопировать в папку webapps? и мне нужно сделать некоторые конфигурации? большое спасибо. –
Команда npm build не создает папку dist, чего я не хватает? –
@BingLu нам не нужно требовать сервер tomcat. просто настройте сервер Apache и вставьте содержимое. если вы хотите использовать tomcat-сервер, тогда создайте проект maven и скопируйте все данные из папки dist в папку webapps в своем проекте, а затем разверните его. –
npm install -g angular-cli")Это работает лучше, если вы создали приложение, используя angular-cli instructions shown here. В корневом каталоге приложения выполните следующую команду ng build --env=prod, и это приведет к связыванию через webpack развертываемых элементов в каталоге \dist.
Скопируйте каталог \dist и вставьте его в {CATALINA_HOME}\webapps. Переименуйте \dist на имя папки, например \foo. Открыть \foo\index.html и редактировать базу-HREF линию, чтобы представить новое имя каталога:
<base href="/foo/">
Start Tomcat с помощью startup.bat или выбранного предпочтения и перейти к http://localhost:8080/foo/, и вы должны быть в состоянии просмотреть Угловое 2 приложения.
Примечание. Если вы не создали проект с помощью команды ng new, я прочитал, где выполнение ng init до сборки позволит вам выполнить следующие шаги. Я не проверял это сам.
У вас есть руководство или что-то о том, как связать все из машинописного текста в один файл и его минимизировать? Я пытаюсь впервые включить свое угловое приложение в производство. Поскольку я новичок в Typcript, я не знаю, какой хороший подход. – Wobbley
Это может быть немного сложно. Я немного освещен здесь: http://stackoverflow.com/questions/33683885/angular2-with-asp-net-5/34495822#34495822 Оставьте мне строку, если вам нужна дополнительная помощь. После настройки он работает как шарм. – brando
Я решил просто переместить мой проект angular2 на: https://github.com/AngularClass/angular2-webpack-starter, и на самом деле было довольно безболезненно создавать одиночные файлы js. – Wobbley