Question

我想让一个角度为2的项目的index.html作为Spring MVC应用程序的欢迎页面运行。我运行角度2的方式是npm start。如果我在不执行npm start的情况下加载index.html，则组件无法正确加载。
如何将index.html作为Spring MVC项目的欢迎页面？

编辑：添加了更多细节。

angular-seed项目按原样加载。我只是尝试从angular-seed项目加载index.html。节点模块已经添加，它与npm start完美匹配。

至于我的web.xml，我有这样的欢迎文件：

  <welcome-file-list>
      <welcome-file>AngularContent/src/index.html</welcome-file>
  </welcome-file-list>

index.html有以下内容：

<!DOCTYPE html>
<html>
  <head>
    <title>Angular QuickStart</title>
    <base href="/">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <base href="/">
    <link rel="stylesheet" href="styles.css">

    <!-- Polyfill(s) for older browsers -->
    <script src="AngularContent/node_modules/core-js/client/shim.min.js"></script>

    <script src="AngularContent/node_modules/zone.js/dist/zone.js"></script>
    <script src="AngularContent/node_modules/systemjs/dist/system.src.js"></script>

    <script src="AngularContent/src/systemjs.config.js"></script>
    <script>
      System.import('AngularContent/src/main.js').catch(function(err){ console.error(err); });
    </script>
  </head>

  <body>
    <my-app>Loading AppComponent content here ...</my-app>
  </body>
</html>

Answer 1

我遇到同样的问题，最近我找到了合适的解决方案。

按照以下步骤实现我们的主要目标，即在单个服务器上运行SPRINGMVC + Angular2。

创建正常的动态网络项目。
添加spring或user maven pom.xml
打开CMD，导航到angular2应用程序。命中命令 npm install下载node_modules然后ng build或使用ng build --prod进行生产。此命令将创建一个“dist”文件夹，复制包括所有文件夹在内的所有文件。
将这些文件和文件夹粘贴到WebContent目录中。
最后，您需要在index.html中更改basehref =“./”。

现在您已准备好运行服务器，或者您可以部署war文件并使用tomcat或其他服务器提供服务。

如果您想要弹簧和角度2的文件结构，请访问this thread。

如何在Spring MVC应用程序中运行Angular 2页面？

1 个答案: