我已经使用angular-cli创建了n个新的角度应用程序。如何部署使用angular-cli构建的angular2应用程序
我完成了应用程序，并使用ng-serve预览它，它工作完美。
之后，我用ng build - 产品，生成'dist'文件夹。当我将该文件夹放入xampp中运行时，它不起作用。我发现没有* .js文件，它应该在* .ts - > * .js转换后（我想）。
我附上了屏幕截图，其中左侧显示了src文件夹，包含所有.ts文件，中间显示'dist'文件夹和浏览器屏幕截图。
请指导我如何从angular-cli生成完整的工作应用程序，我可以在我的xampp服务器中运行该应用程序。
截图：
方法1（流行的一种）： 如果使用角-CLI，那么
ng build --prod
就可以了。然后你可以从.dist文件夹复制到所有服务器的文件夹
方法2：
您可以使用HTTP服务器，以满足您的应用程序。要安装HTTP服务器
npm install http-server -g
，并打算到项目文件夹
http-server ./dist
它将为您的文件夹中的所有文件后。您可以检查终端可以使用哪些ip地址和端口来访问应用程序。现在打开你的浏览器，输入
ip-adress:port/index.html
希望它会帮助你:)
奖励： 如果你想在Heroku的部署。请通过这个详细的教程去 https://medium.com/@ryanchenkie_40935/angular-cli-deployment-host-your-angular-2-app-on-heroku-3f266f13f352
有效，但首先使用角度cli，您必须使用ng build来构建您的项目 –
您可以键入http-server ./dist -o直接在浏览器中打开应用程序。 – Damith
谢谢，这是我的工作，但当我刷新页面时，它没有发现错误 –
我使用的是最新版本的角CLI的（在此时间回复其1.0.0Beta-18）
方式这个版本的工作原理是它把一切都在捆绑文件中，并在index.html文件中调用它们。之后，您必须将您的资产复制到dist文件夹（出于某种原因，它不会那样做）。最后，仔细检查你的基础href，确保它的设置为需要设置，然后它应该工作。这对我来说很有用，并且我已经在Apache和Node上进行了测试。
对于任何寻找IIS托管答案的人...
生成项目
ng build --prod
复制./dist文件夹中的所有内容到您的网站保持./dist内的文件夹结构的根文件夹（也就是 - 不要四处移动任何东西）。使用Beta-18版本的angular-cli所有资产（我的例子中的图片）在构建期间被复制到./dist/assets，并且在其包含的组件中被正确引用。
那么你也部署了.gz和.map文件？ – EdL
在IIS上，您不必部署.gz文件，只需[配置]（https://www.iis.net/configreference/system.webserver/httpcompression）IIS即可使用动态压缩，您可以节省很多字节通过电线。 .map文件是源地图。把它们想象成javascript世界的.pdb，所以是的，如果你想在你要部署的服务器上进行调试。如果没有它们，丑化JS使得调试非常困难（阅读：不可能）。 –
我遵循Apache服务器中的方法部署。它工作，但刷新（Cntrl + R）子页面时页面显示为中断。例如在我的情况下，该网页将无法直接访问http://example.com/question。任何人有一个想法如何解决这个问题？ – srijishks
下面是与Heroku的一个例子：
创建Heroku的帐户，并安装CLI
将在package.json的angular-cli DEP到dependencies（以便它被安装，当你推到的Heroku
添加一个postinstall脚本，该脚本在代码被推送到Heroku时将运行ng build。将在以下步骤中创建的节点服务器。这会将应用程序的静态文件放置在服务器上的dist目录中，然后启动应用程序。
"scripts": {
// ...
"start": "node server.js",
"postinstall": "ng build --aot -prod"
}
// server.js
const express = require('express');
const app = express();
// Run the app by serving the static files
// in the dist directory
app.use(express.static(__dirname + '/dist'));
// Start the app by listening on the default
// Heroku port
app.listen(process.env.PORT || 8080);
heroku create
git add .
git commit -m "first deploy"
git push heroku master
这里有一个快速writeup我这样做，有更多详细信息，包括如何强制要求使用HTTPS，以及如何处理PathLocationStrategy :)
我推荐这个！很好的方式在任何时间在实时环境中查看您的应用程序。有关更多详细信息，请参阅https://medium.com/@ryanchenkie_40935/angular-cli-deployment-host-your-angular-2-app-on-heroku-3f266f13f352 – SrAxi
如果您在使用Typescript中的节点服务器使用Angular Universal，该怎么办？ –
检查index.html文件并编辑该line
<base href="/[your-project-folder-name]/dist/">
您的内容应该正确加载。然后，您可以载入样式全球
应设置基本href作为与--bh标志建议由Johan
ng build --prod --bh /[your-project-folder-name]/dist/
不要编辑index.html，使用ng生成/服务与--bh参数 –
哦是的，谢谢，我相信基础href是他的问题的解决方案。 ng build --prod --bh/[your-project-folder-name]/dist/ –
+1但希望澄清一下，您不需要在终端中包含dist ng build --bh/mycoolapp/< - ----为我工作 –
使用ng build
集基地标签的href到/ myUrl /在你的index.html ：
ng build --base-href /myUrl/
ng build --bh /myUrl/
我目前使用的是Angular-CLI 1.0.0-beta.32。3
在项目运行的根目录NPM安装HTTP服务器-g
安装成功运行 纳克生成后在成功构建运行--prod
HTTP -server ./dist
我们有多种选择来部署角度应用程序。我总结了要在IIS中部署它的要点。
什么版本的angular-cli？你是否在使用--mobile和angular-universal？ – Splaktar