Javascript 托管 Angular 2 应用
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/37786319/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Hosting Angular 2 app
提问by user1608228
I'm new to Angular 2, I know host Angular 1.xon shared hosting like GoDaddy, but I don't have idea how publish Angular 2application, for example I have this structure folder:
我是新来的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
What file i need to upload on ftp?
我需要在ftp上上传什么文件？
I don't tried anything because I don't know how to proceed
Thanks in advance!
我没有尝试任何东西，因为我不知道如何继续
在此先感谢！
回答by eko
If you don't have a backend, free hosting sites will usually look for an index.html to begin their job. Hence, your folder structure is correct but you will need to upload the js files instead of the ts files.
如果您没有后端，免费托管站点通常会寻找 index.html 来开始他们的工作。因此，您的文件夹结构是正确的，但您需要上传 js 文件而不是 ts 文件。
回答by Daniel Pliscki
As a component based language, angular 2 includes some caveats in it's deployment process. First, the files used in development environment aren't necessarily shipped to production. In short, you'll only need to upload .js, .html and .css files .
作为基于组件的语言，angular 2 在其部署过程中包含一些注意事项。首先，开发环境中使用的文件不一定会交付到生产环境中。简而言之，您只需要上传 .js、.html 和 .css 文件。
Second is that even if your application works deploying only the files mention above, it's advisable to include the following process:
其次，即使您的应用程序仅部署上述文件，也建议包含以下过程：
Bundling: Compiling all the .js files into single files. For instance, vendor.js could include all third party libs and bundle.js would include all application .js files. (Bundles are import for performance reasons, but bear in mind that with the arrival of http 2, this process will be abandoned)
捆绑：将所有 .js 文件编译成单个文件。例如，vendor.js 可以包含所有第三方库，bundle.js 将包含所有应用程序 .js 文件。（Bundles 是出于性能原因导入的，但请记住，随着 http 2 的到来，此过程将被放弃）
Minification: it's a standard process in all web apps, but now you only minify bundled files.
缩小：这是所有网络应用程序中的标准过程，但现在您只能缩小捆绑文件。
Take a look in this article, as it give some examples of tools that can help you with deployment process. http://www.ninjaducks.in/hacking/angular-setup/
请查看本文，因为它提供了一些可以帮助您完成部署过程的工具示例。 http://www.ninjaducks.in/hacking/angular-setup/
回答by Pat M
I think that one popular workflow is to gulp-typescript your .ts files, and send the resulting .js files into a distribution folder. The many .js files could also be "gulp-concatenated" (gulp-concat) into one file.
我认为一种流行的工作流程是对 .ts 文件进行 gulp-typescript，然后将生成的 .js 文件发送到分发文件夹中。许多 .js 文件也可以“gulp-concatenated”（gulp-concat）到一个文件中。
Of course you'll need to be sending your html and css files as well.
当然，您还需要发送 html 和 css 文件。
Since the Angular2 library relies heavily on what's in the node_modules folder as well, you would need to upload your package.json and npm install on the server side. You could try uploading the node_modules but the upload takes a lot of time.
由于 Angular2 库也严重依赖于 node_modules 文件夹中的内容，因此您需要在服务器端上传 package.json 和 npm install。您可以尝试上传 node_modules，但上传需要很多时间。
回答by UsmanChaudhri
You need to build angular2 project using tools like webpack or angular-cli - which also uses webpack post beta.14 release. Webpack will create a distribution directory - dist - which you can deploy to the server. Webpack bundles all the code into a single file which it puts inside the dist folder. Here's a good resource to understand the code and deployment structure of angular2 app: https://github.com/mirkonasato/angular2-course-webpack-starter
您需要使用 webpack 或 angular-cli 之类的工具构建 angular2 项目 - 它还使用 webpack post beta.14 版本。Webpack 将创建一个分发目录 - dist - 您可以将其部署到服务器。Webpack 将所有代码打包成一个文件，放在 dist 文件夹中。这里有一个很好的资源来理解 angular2 应用程序的代码和部署结构：https: //github.com/mirkonasato/angular2-course-webpack-starter
Clone the above directory, run "npm install" to install all dependencies and run "npm run build" you will see the distribution folder - dist - which you can deploy.
克隆上面的目录，运行“npm install”来安装所有依赖项，然后运行“npm run build”你会看到分发文件夹 - dist - 你可以部署它。
回答by Max
Well, you can run ng build in your root application directory. It will create a dist directory containing the app and files. You can put this directory into the page the webserver will look for the index.html
好吧，您可以在根应用程序目录中运行 ng build 。它将创建一个包含应用程序和文件的 dist 目录。您可以将此目录放入网络服务器将查找 index.html 的页面中
