Question

我是Angular2的新手，对node.js和angular2框架功能和关系有点混淆。

我可以在localhost上使用lite-server运行我的应用程序，但我的问题是将应用程序上传到托管服务。当应用程序准备就绪时，没有任何教程或指南可以做什么，所以我一直在尝试使用webpack创建一个包，但我没有成功。我知道上传由node_modules安装的所有npm是一种不好的做法，但我是否正确尝试制作此类捆绑包？

另一个澄清是，如果我的应用只需上传html，css和js文件（包括node_modules中的文件）即可运行我的应用程序？或者我是否需要配置允许Node.js运行我的应用程序的主机？

Answer 1

在Angular2中，如果你使用Typescript，你需要转换webapp，这个transile把文件放在/ dist文件夹中。如果您使用ES6，则使用您开发的根文件夹中的应用程序。

我在你/ dist文件夹的浏览器中打开了“index.html”，这是应用于angular2的工作。

在index.html中，您有此代码

System.import('system-config.js').then(function () {
  System.import('main');
}).catch(console.error.bind(console));

在/ dist的main.js中你有这个代码

var _1 = require('./app/');

在此文件夹中，您需要这个（例如）

var ng_fire_component_1 = require('./ng-fire.component');

这需要调用webbapp的主要组件...在此逻辑中，当ng-fire.component是你的根组件时，你的app只运行index.html。

在节点中你只需要创建一个web服务器，这个webserver（如果使用express js）你需要调用index.html

router.get('/', function(req, res){
  res.sendfile('yourAPPfolder/index.html');
});

当您打开www.yourweb.com/或localhost时，您的webApp会再次运行：yourPort /

对于最后一个问题，如果使用服务器，则在此文件夹中导入文件夹/ dist，您需要所有文件。

我建议使用angular ci（https://cli.angular.io）来处理angular2 ...如果您需要其他供应商文件或供应商文件夹，您可以在文件中添加angular-cli-build.js

例如：

    /* global require, module */

var Angular2App = require('angular-cli/lib/broccoli/angular2-app');

    module.exports = function(defaults) {
      return new Angular2App(defaults, {
        vendorNpmFiles: [
          'systemjs/dist/system-polyfills.js',
          'systemjs/dist/system.src.js',
          'zone.js/dist/*.js',
          'es6-shim/es6-shim.js',
          'reflect-metadata/*.js',
          'rxjs/**/*.js',
          '@angular/**/*.js'
        ]
      });
    };

将Angular2 App的必要依赖项上载到Web主机

1 个答案: