该文件需要指定下列参数:
(1) node版本
(2) npm版本
(3) working directory
(4) 加入3个:
+ 下载node和npm到node和node_modules路径下。
+ npm下载该项目的依赖包
+ npm 进行项目的build
默认情况下,angular-cli会把最终的ng2应用放在src\main\frontend\dist
路径下,可以通过修改angular-cli.json
文件将最终生成的路径修改成我们需要打包放置的位置上。
{
"root": "src",
"outDir": "../../../target/frontend",
"assets": [
"assets",
"favicon.ico"
],
"index": "index.html",
"main": "main.ts",
"polyfills": "polyfills.ts",
"test": "test.ts",
"tsconfig": "tsconfig.app.json",
"testTsconfig": "tsconfig.spec.json",
"prefix": "app",
"styles": [
"styles.css"
],
"scripts": [],
"environmentSource": "environments/environment.ts",
"environments": {
"dev": "environments/environment.ts",
"prod": "environments/environment.prod.ts"
}
}
]
第五步: 使spring boot打包时候能联动angular2.
由于maven打包时候,会默认把resource路径下的东西拷贝到jar包中,因此,可以将打包后的ng2程序添加到maven的resource路径下。
com.jdriven.ng2boot
frontend
${project.version}
runtime
···
target/frontend
static
第六步: 执行打包和测试
在主目录下执行下列的命令:
mvn clean install
cd backend
mvn spring-boot:run
从浏览器中进行测试:
http://localhost:8080
多说一句
在ng2中要实现服务端不同端口的通信,需要在前端这样实现。
- 修改package.json代码,添加如下:
"scripts": {
"ng": "ng",
"start": "ng serve --proxy-config proxy.conf.json",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
}
修改proxy.conf.json
文件,添加如下:
{
"/api": {
"target": "http://localhost:8080",
"secure": false
}
}