ng2集成spring boot的后台(1)

使用ng2和Spring Boot集成一个项目

第一步 创建一个Spring Boot项目

在https://start.spring.io/上创建一个后台的Spring Boot程序，以提供对应的REST服务。

第二步 分离前后台模块

将前后端分为对应的不同maven模块。

1. 新建一个总的项目目录，将后端程序拷贝进去。
2. 在总的目录下新建一个前端路径，如：frontend\src\main
3. 拷贝后端的pom文件，直接放在总的项目目录下，并进行修改。

    4.0.0

    com.jdriven.ng2boot
    parent
    0.0.1-SNAPSHOT
    pom

    parent
    The ng2boot parent project

    
        org.springframework.boot
        spring-boot-starter-parent
        1.5.2.RELEASE
         
    

    
        UTF-8
        UTF-8
        1.8
    

    
        frontend
        backend
    

4. 修改后端的pom文件

    4.0.0

    backend

    backend
    The ng2boot backend project

    
        com.jdriven.ng2boot
        parent
        0.0.1-SNAPSHOT
    

    
        
            org.springframework.boot
            spring-boot-starter-web
        

        
            org.springframework.boot
            spring-boot-starter-test
            test
        
    

    
        
            
                org.springframework.boot
                spring-boot-maven-plugin
            
        
    

5. 为前台添加一个pom文件

    4.0.0

    frontend

    frontend
    The ng2boot frontend project

    
        com.jdriven.ng2boot
        parent
        0.0.1-SNAPSHOT
    

    
        
        
    

第三步 添加ng2程序到前端的main路径

执行命令： ng new --skip-git --directory frontend ng2boot

执行项目路径是当前路径下的frontend路径下，创建一个名称为ng2boot的项目（该名称不在路径上体现）。
注意：不要创建git目录，因为整体上已经是一个maven项目，后续我们必然按照大项目来提交git。

第四步： 配置maven来build ng2的项目

使用frontend-maven-plugin插件来编译ng2 的应用程序。

1. 添加插件到前端的pom文件的build/plugins部分。

            
                com.github.eirslett
                frontend-maven-plugin
                1.3

                
                    v6.10.1o
                    4.4.1
                    src/main/frontend
                

                
                    
                        install node and npm
                        
                            install-node-and-npm
                        
                    

                    
                        npm install
                        
                            npm
                        
                    

                    
                        npm run build
                        
                            npm
                        

                        
                            run build