標題看上去還是蠻嚇人的，首先這不是標題黨，也不是最終解決方案，用于項目需謹慎！
Angular2 中秋發布一來，有很多大神嘗鮮，活躍在論壇上，但是基本都是前端開發的部分，很少或是沒有找到于后端相關的。作為長期前后端一起做的苦逼程序員，沒有前端妹子支持，只好多琢磨了。
一、先來看下我們的目標：
上圖是我昨天給同事發的，描述了基本的結構。
二、環境準備：
開發工具：
1、Eclipse Neon Release (4.6.0)、及maven 等相關插件
2、NodeJs、Git
3、angular2-eclipse 插件
4、聯網
準備工作：
如果你想過整合上述關鍵詞的話，我想你應該看過如下類似文章：
1、Angular2 eclipse中angular2開發環境的搭建
2、Angular 2 directives based on Bootstrap's markup and CSS
3、SSM框架——詳細整合教程（Spring+SpringMVC+MyBatis）
4、使用Mybatis-Generator自動生成Dao、Model、Mapping相關文件
在這里，我們的重點是Angluar2與JavaWeb，假設你都看過。
并且很幸運跑起來了。
補充下：《Angular2 eclipse中angular2開發環境的搭建》文中
// 執行命令時不要最后面的點“.”，且執行該命令之前你得先安裝好Git、Python27，
// 需要訪問網絡，而且各種慢
// 注意是Python2.7版本，我安裝過高版本不行...
npm install -g angular-cli
三、整合：
現在你的后端開發是這樣的：
前端開發的效果是這樣的
創建一個項目真不容，網上下載慢，還要被墻，哎。。。
接下來就是我們正題了：
Angular1的時候Eclipse安裝插件后，可以轉成Angular項目，很可惜Angular2沒有
選擇java web項目右鍵 > configure > convent to angular project
- 1、在Java web項目中新建文件夾web
- 2、拷貝project_angular項目中文件到JavaWeb項目得web目錄中（.project 可以不需要）
- 3、在java web項目中映射angular項目dist文件夾
選擇java web項目右鍵 > Properties > Deployment Assembly
And > Folder > 選擇 web/dist > ok
其實最主要得就是這一步，這樣angular2 編譯后得文件在dist里面，添加映射后，Java web Run As Server 時會把dist里面得文件放到與src/main/webapp/編譯后相同的地方，也就是web根目錄，優先級是后面的，也就是dist。
- 4、這樣你就可以run javaweb項目了，但是，出來的首頁會一直顯示加載中（是不是很著急）。
- 5、經過調試，你不難發現在運行javaweb時反問路徑時這樣的：
http://localhost:8080/ovit-java-framework/
而angular路徑是這樣的
http://localhost:4200/
不一樣的是有一個以項目命名的虛擬路徑，所以我們得更改web/dist/index.html 的base
<!-- web/dist/index.html --!>
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>ProjectAngularTest</title>
<!-- 這里加上你項目名稱 --!>
<base href="/ovit-java-framework/">
<!-- <base href="/"> -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
<link rel="stylesheet" href="res/css/bootstrap.min.css">
</head>
<body>
<app-root>加載中...</app-root>
<script type="text/javascript" src="inline.js"></script><script type="text/javascript" src="styles.bundle.js"></script><script type="text/javascript" src="main.bundle.js"></script></body>
</html>
- 6、重新run as server 你的java web項目，是不是跑起了！！！
讓我們整理下思路，回顧下開發過程
- 1、修改了后端代碼：
項目 > 右鍵 > Run As Server
- 2、修改了前端代碼：
1)、在web/目錄所在的物理路徑執行ng build
D:\Work\BSI\Code\ovit-java-framework\web>ng build
2)、修改web/dist/index.html文件中的path
3)、項目 > 右鍵 > Run As Server
總結
其實這（是）算（不）不（是）上（有）是（扁）項（我）目（的）整（沖）合（動），很牽強。
弊端，或者說有還沒配合好的地方
- 1、新建的angular2 項目 > 右鍵 > Run As 選項中有 ng build、ng server、npm intall、npm update等快捷運行的功能，整合后都沒有了，殘存的 npm intall、npm update 也沒有反應，應該是與.project文件有關。
- 2、開發非常不方便：修改前端的*.ts 等文件后運行起了比較麻煩，且跟eclipse毛關系都沒有，所以你的前端還是可以選項你自己的工具，比如subline等。
但總的來說 Angular2與JavaWeb在一起了，如果各位有更好的方法，我只想對你說“老司機，帶帶我！！！”。
作為一個比較懶程序員，我總是先加入一些自動生成代碼、通用服務的功能能，以保證做大量重復的業務的編碼時偷懶，從而形成我的懶人開發模式 -。
