我是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上传哪个文件?
我没有尝试任何事情,因为我不知道如何处理 提前谢谢!
答案 0 :(得分:5)
如果您没有后端,免费托管网站通常会寻找index.html来开始他们的工作。因此,您的文件夹结构是正确的,但您需要上传js文件而不是ts文件。
答案 1 :(得分:5)
作为一种基于组件的语言,angular 2在其部署过程中包含一些警告。 首先,开发环境中使用的文件不必运送到生产环境。简而言之,您只需要上传.js,.html和.css文件。
其次,即使您的应用程序只能部署上面提到的文件,建议包括以下过程:
捆绑:将所有.js文件编译为单个文件。例如,vendor.js可以包含所有第三方库,而bundle.js可以包含所有应用程序.js文件。 (捆绑包是出于性能原因导入的,但请记住,随着http 2的到来,这个过程将被放弃)
缩小:它是所有网络应用中的标准流程,但现在您只需缩小捆绑文件。
看一下本文,因为它提供了一些可以帮助您部署过程的工具示例。 http://www.ninjaducks.in/hacking/angular-setup/
答案 2 :(得分:4)
我认为一个流行的工作流程是gulp-typescript你的.ts文件,并将生成的.js文件发送到分发文件夹。许多.js文件也可以“gulp-concatenated”(gulp-concat)到一个文件中。
当然你也需要发送你的html和css文件。
由于Angular2库在很大程度上依赖于node_modules文件夹中的内容,因此您需要在服务器端上传package.json和npm install。您可以尝试上传node_modules,但上传需要花费大量时间。
答案 3 :(得分:1)
你需要使用像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。
答案 4 :(得分:1)
好吧,您可以在根应用程序目录中运行ng build。它将创建一个包含app和文件的dist目录。您可以将此目录放入Web服务器将查找index.html
的页面中