问题 托管Angular 2应用程序


我是新来的 Angular 2,我知道主持人 Angular 1.x 在共享主机上 GoDaddy,但我不知道如何发布 Angular 2 应用程序,例如我有这个结构文件夹:

angular2-quickstart

--app
  app.component.ts
  main.ts

--node_modules

--typings

index.html
package.json
styles.css
systemjs.config.js
tsconfig.json
typings.json

我需要在ftp上传什么文件?

我没有尝试任何东西,因为我不知道如何继续
提前致谢!


1533
2018-06-13 09:35


起源

你好,你可以在godaddy上传你的角度2项目吗? - funky-nd
除了在index.html文件中导入一些javascript文件以在客户端成功运行angular2应用程序之外,您不需要任何其他操作。查看此实例 angular.io/resources/live-examples/quickstart/js/plnkr.html  从那里下载并将其解压缩到您共享主机中的所需文件夹,这就是全部。 - user1685442
这也可以解决这个问题。 “如何捆绑Angular2进行生产”> stackoverflow.com/q/37631098/4155124 - Pat M


答案:


作为基于组件的语言,angular 2在其部署过程中包含一些警告。 首先,开发环境中使用的文件不一定要发送到生产环境。简而言之,您只需要上传.js,.html和.css文件。

其次,即使您的应用程序只能部署上面提到的文件,建议包括以下过程:

捆绑:将所有.js文件编译为单个文件。例如,vendor.js可以包含所有第三方库,而bundle.js将包括所有应用程序.js文件。 (捆绑包是出于性能原因导入的,但请记住,随着http 2的到来,这个过程将被放弃)

缩小:它是所有Web应用程序中的标准流程,但现在您只需缩小捆绑文件。

请看一下本文,因为它提供了一些可以帮助您部署过程的工具示例。 http://www.ninjaducks.in/hacking/angular-setup/


5
2018-06-13 14:27





如果您没有后端,免费托管网站通常会寻找index.html来开始他们的工作。因此,您的文件夹结构是正确的,但您需要上传js文件而不是ts文件。


5
2018-06-13 09:42





我认为一个流行的工作流程是gulp-typescript你的.ts文件,并将生成的.js文件发送到分发文件夹。许多.js文件也可以“gulp-concatenated”(gulp-concat)到一个文件中。

当然你也需要发送你的html和css文件。

由于Angular2库在很大程度上依赖于node_modules文件夹中的内容,因此您需要在服务器端上传package.json和npm install。您可以尝试上传node_modules,但上传需要花费大量时间。


5
2018-06-13 14:38





你需要使用像webpack或angular-cli这样的工具来构建angular2项目 - 这也是使用webpack post beta.14发布的。 Webpack将创建一个分发目录 - dist - 您可以将其部署到服务器。 Webpack将所有代码捆绑到一个文件中,放在dist文件夹中。这是了解angular2应用程序的代码和部署结构的一个很好的资源: https://github.com/mirkonasato/angular2-course-webpack-starter

克隆上面的目录,运行“npm install”来安装所有依赖项并运行“npm run build”你会看到你可以部署的分发文件夹 - dist。


1
2017-11-23 13:14





那么,您可以在根应用程序目录中运行ng build。它将创建一个包含app和文件的dist目录。您可以将此目录放入Web服务器将查找index.html的页面中


0
2017-11-01 20:23



请说明/解释这个答案的问题和原因。 - toonarmycaptain
看一下这个 angular.io/guide/deployment。 胆大 'ng build'脚本生成角度应用程序的“部署版本”。此页面还包含需要对托管应用程序的服务器执行的配置。 @ user6449413显示的结构是开发代码,它也运行但不应发布到托管服务器。 - Max