美文网首页
前后端分离怎么打包,看我就够了

前后端分离怎么打包,看我就够了

作者: 一万年不是尽头 | 来源:发表于2020-07-28 17:02 被阅读0次

    2020了,新项目应该大多都采用前后端完全分离了,前后端采用ajax进行交互,不再像以前一样了,但从中引发出另一个问题,那就是系统集成打包部署又显得很麻烦,不再像之前一样简单的运行一个命令,多了繁琐的操作。下面由我介绍一下frontend-maven-pluginmaven-resources-plugin这两个插件配合的使用方案

    前置条件

    项目结构

    ├── dava-admin
    │ ├── web
    │ │ ├─── src
    │ │ │ ├─── main
    │ │ │ │ ├─── java
    │ │ │ │ ├─── resources
    │ │ │ │ │ ├─── view //此目录是我们的目标路径(实际项目中,看你们个人喜好)
    │ │ │ │ │ ├─── 其他文件(夹)
    │ │ │ └─── test
    │ │ ├─── 其他文件(夹)
    │ │ └─── pom.xml
    │ ├── view
    │ │ ├─── dist //前端打包后的输出文件(实际项目中,看你们个人喜好)
    │ │ ├─── node_modules
    │ │ ├─── public
    │ │ ├─── src
    │ │ ├─── package.json
    │ │ ├─── 其他文件(夹)
    │ │ └─── pom.xml
    │ └─── pom.xml
    

    其他环境

    java环境配置:https://www.jianshu.com/p/daa560344afe
    maven环境:以后补充

    配置

    dava-admin下的pom.xml

    <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
        <modelVersion>4.0.0</modelVersion>
        <groupId>xyz.dava</groupId>
        <artifactId>dava-admin</artifactId>
        <version>1.0-SNAPSHOT</version>
        <modules>
            <module>view</module>
            <module>web</module>
        </modules>
        <packaging>pom</packaging>
    </project>
    

    view 下的pom.xml

    <project xmlns="http://maven.apache.org/POM/4.0.0"
             xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
             xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
        <parent>
            <artifactId>dava-admin</artifactId>
            <groupId>xyz.dava</groupId>
            <version>1.0-SNAPSHOT</version>
         </parent>
        <modelVersion>4.0.0</modelVersion>
    
        <artifactId>view</artifactId>
    
        <properties>
            <frontend-maven-plugin.version>1.6</frontend-maven-plugin.version>
        </properties>
        <build>
            <plugins>
                <plugin>
                    <groupId>com.github.eirslett</groupId>
                    <artifactId>frontend-maven-plugin</artifactId>
                    <version>${frontend-maven-plugin.version}</version>
                    <executions>
                        <execution>
                            <id>install node and yarn</id>
                            <goals>
                                <goal>install-node-and-yarn</goal>
                            </goals>
                            <phase>generate-resources</phase>
                            <configuration>
                                <nodeVersion>v12.16.2</nodeVersion>
                                <yarnVersion>v1.22.4</yarnVersion>
                            </configuration>
                        </execution>
                        <execution>
                            <id>yarn install</id>
                            <goals>
                                <goal>yarn</goal>
                            </goals>
                            <configuration>
                                <arguments></arguments>
                            </configuration>
                        </execution>
                        <execution>
                            <id>yarn build</id>
                            <goals>
                                <goal>yarn</goal>
                            </goals>
                            <configuration>
                                <arguments>build</arguments>
                            </configuration>
                        </execution>
                    </executions>
                </plugin>
            </plugins>
        </build>
    </project>
    

    web 下的pom.xml

    <project xmlns="http://maven.apache.org/POM/4.0.0"
             xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
             xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
        <modelVersion>4.0.0</modelVersion>
        <parent>
            <artifactId>dava-admin</artifactId>
            <groupId>xyz.dava</groupId>
            <version>1.0-SNAPSHOT</version>
        </parent>
        <artifactId>web</artifactId>
        <version>0.0.1-SNAPSHOT</version>
        <packaging>war</packaging>
        <name>web</name>
        <description>ims平台后台管理系统</description>
    
        <properties>
            <java.version>1.8</java.version>
        </properties>
        <build>
            <finalName>dava-admin</finalName>
            <plugins>
                <plugin>
                    <artifactId>maven-resources-plugin</artifactId>
                    <executions>
                        <execution>
                            <id>copy Vue.js frontend content</id>
                            <phase>generate-resources</phase>
                            <goals>
                                <goal>copy-resources</goal>
                            </goals>
                            <configuration>
                                <outputDirectory>src/main/resources/view</outputDirectory>
                                <overwrite>true</overwrite>
                                <resources>
                                    <resource>
                                        <directory>${project.parent.basedir}/view/dist</directory>
                                        <includes>
                                            <include>**</include>
                                        </includes>
                                    </resource>
                                </resources>
                            </configuration>
                        </execution>
                    </executions>
                </plugin>
            </plugins>
        </build>
    </project>
    

    打包

    经过简单的设置然后在dava-admin目录下执行mvn package

    相关文章

      网友评论

          本文标题:前后端分离怎么打包,看我就够了

          本文链接:https://www.haomeiwen.com/subject/dnhrkctx.html