（一）从新建文件夹到运行于服务器——《魔塔》

2023-11-17 20:01:45

(由于格式问题，建议到我的博客原文查看)
写在前头
大家好，我~~心血来潮~~来更新啦！
在上一篇文章的项目概述中，我们大概了解了《魔塔》项目的开发流程，这篇文章将从Maven项目创建开始说起，在此之前，你需要完成：

能运行在本地浏览器的游戏主体

基本的三个静态网页

如果你对上面这两点不是很清楚，你可戳这里看上期博客介绍，或者戳这里进GitHub下载我的代码，查看webapp目录下的js {% span small gray, (index、login、register、storage可暂时不看) %} 和html文件，理解代码含义。

创建项目并使用Maven管理

创建Maven项目

你可以使用自己下载的Maven，也可以使用IDEA内置的Maven，这里我使用IDEA内置的Maven创建项目；

打开IDEA，依次选择File->new->project->Maven，勾选{% kbd Create from archetype %}，选择下图中的模板，点击next；

给你的项目命名，设置项目位置（默认即可），下面的红框可不填；

选择你IDEA安装目录下的Maven文件，你可以参考我的路径查找，最后的Local repository是仓库位置，你可以自定义一个文件夹，点击Finsh，等待项目构建完毕；

在新建的项目中选择File->Settings，检查相应配置与下图是否一致。
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-pbW6hAQX-1615200675917)(https://qiniu.scauwlt.top//1607337854(1)].png)

整理项目，添加依赖

整理架构

在src下的main目录右键新建一个文件夹，命名为java并设置为Source Root文件夹；IDEA通常会有提示，按照下图操作，选择1，2即可（3可以不建，项目中配置文件较少）

这个文件夹下我们用来放servlet和数据库工具包的Java代码。

修改pom.xml，添加依赖

我们可以在pom.xml文件中配置项目相关信息，且最为重要的是能导入和管理依赖，省去自己下载和导入jar包的麻烦！具体操作步骤如下：

将< properties >中的两个1.7改为1.8

将< build > 中的所有内容删除

操作完上面两步后的pom.xml如下图所示：

添加依赖：将项目中对应标签对替换成下面的标签对
{% folding green, dependencies标签对 %}

  <dependencies>
    <dependency>
      <groupId>junit</groupId>
      <artifactId>junit</artifactId>
      <version>4.11</version>
      <scope>test</scope>
    </dependency>

    <dependency>
      <groupId>commons-beanutils</groupId>
      <artifactId>commons-beanutils</artifactId>
      <version>1.8.0</version>
    </dependency>

    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-context</artifactId>
      <version>5.2.10.RELEASE</version>
    </dependency>

    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-tx</artifactId>
      <version>5.2.10.RELEASE</version>
    </dependency>

    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-jdbc</artifactId>
      <version>5.2.10.RELEASE</version>
    </dependency>


    <dependency>
      <groupId>com.fasterxml.jackson.core</groupId>
      <artifactId>jackson-core</artifactId>
      <version>2.9.0</version>
    </dependency>

    <dependency>
      <groupId>com.fasterxml.jackson.core</groupId>
      <artifactId>jackson-databind</artifactId>
      <version>2.9.0</version>
    </dependency>

    <dependency>
      <groupId>mysql</groupId>
      <artifactId>mysql-connector-java</artifactId>
      <version>8.0.20</version>
    </dependency>

    <dependency>
      <groupId>com.alibaba</groupId>
      <artifactId>druid</artifactId>
      <version>1.0.9</version>
    </dependency>

    <dependency>
      <groupId>javax.servlet</groupId>
      <artifactId>javax.servlet-api</artifactId>
      <version>3.1.0</version>
      <scope>provided</scope>
    </dependency>

  </dependencies>

{% endfolding %}

{% folding yellow, build标签对 %}

  <build>
    <resources>
      <resource>
        <directory>src/main/java</directory><!--所在的目录-->
        <includes><!--包括目录下的.properties,.xml 文件都会扫描到-->
          <include>**/*.properties</include>
          <include>**/*.xml</include>
        </includes>
        <filtering>false</filtering>
      </resource>
    </resources>
  </build>

{% endfolding %}

完整的pom.xml文件如下，拷贝后修改一下名字信息即可使用；
{% folding blue, 完整pom文件 %}

  <?xml version="1.0" encoding="UTF-8"?>

<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>top.scauwlt</groupId>
  <artifactId>MagicTower</artifactId>
  <version>1.0-SNAPSHOT</version>
  <packaging>war</packaging>

  <name>MagicTower Maven Webapp</name>
  <!-- FIXME change it to the project's website -->
  <url>http://www.scauwlt.top</url>

  <properties>
    <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
    <maven.compiler.source>1.8</maven.compiler.source>
    <maven.compiler.target>1.8</maven.compiler.target>
  </properties>

  <dependencies>
    <dependency>
      <groupId>junit</groupId>
      <artifactId>junit</artifactId>
      <version>4.11</version>
      <scope>test</scope>
    </dependency>

    <dependency>
      <groupId>commons-beanutils</groupId>
      <artifactId>commons-beanutils</artifactId>
      <version>1.8.0</version>
    </dependency>

    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-context</artifactId>
      <version>5.2.10.RELEASE</version>
    </dependency>

    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-tx</artifactId>
      <version>5.2.10.RELEASE</version>
    </dependency>

    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-jdbc</artifactId>
      <version>5.2.10.RELEASE</version>
    </dependency>


    <dependency>
      <groupId>com.fasterxml.jackson.core</groupId>
      <artifactId>jackson-core</artifactId>
      <version>2.9.0</version>
    </dependency>

    <dependency>
      <groupId>com.fasterxml.jackson.core</groupId>
      <artifactId>jackson-databind</artifactId>
      <version>2.9.0</version>
    </dependency>

    <dependency>
      <groupId>mysql</groupId>
      <artifactId>mysql-connector-java</artifactId>
      <version>8.0.20</version>
    </dependency>

    <dependency>
      <groupId>com.alibaba</groupId>
      <artifactId>druid</artifactId>
      <version>1.0.9</version>
    </dependency>

    <dependency>
      <groupId>javax.servlet</groupId>
      <artifactId>javax.servlet-api</artifactId>
      <version>3.1.0</version>
      <scope>provided</scope>
    </dependency>

  </dependencies>

  <build>
    <resources>
      <resource>
        <directory>src/main/java</directory><!--所在的目录-->
        <includes><!--包括目录下的.properties,.xml 文件都会扫描到-->
          <include>**/*.properties</include>
          <include>**/*.xml</include>
        </includes>
        <filtering>false</filtering>
      </resource>
    </resources>
  </build>
</project>

{% endfolding %}

完成上述工作后，同时按下{% kbd Ctrl %} + {% kbd Shift %} + {% kbd O %} 刷新Maven项目，并开始下载对应依赖（需要一段时间）

修改web.xml版本

默认的web版本是1.0，可能不支持servlet等工具们需要修改为3.0或以上版本，点击这里，工具教程修改版本，需要注意的是，删除后重新添加web.xml时命名需要修改，例如web1.xml，添加完成后再修改为web.xml。

在本地Tomcat服务器上运行单机项目

创建完Maven项目后，我们趁热打铁，把Tomcat服务器配置好，并在这上面试着运行之前的单机项目；
Tomcat配置：操作链接
按照这个博客配置好Tomcat，我的版本是8.5.31；配置好后先不要关闭窗口，在上方分栏选择Deployment，添加Artifacts，如下图：

将下方设置为"/"

接着我们将之前做好的MagicTower和Bootstrap文件夹复制到webapp目录下，将webapp下的index.jsp文件删除，再在webapp目录下新建index.html，作为游戏主页（这里偷懒直接设置成跳转到游戏页面），你可以直接在我的Github上下载我的文件进行操作；总之，你现在的项目目录结构应该是这样的：

接下来我们启动一下Tomcat，如果你之前的步骤没有问题，在Tomcat启动完成并自动打开浏览器后，会跳出以下界面：

很好，到这一步我们已经实现了静态项目的所有操作了，要完成本地项目，还差后端以及前后端数据库关联，这一部分的内容十分重要，我决定放在下一篇文章写，绝不是偷懒，嘻嘻！

写在最后

这一篇主要是配置项目，有点杂乱，如果你遇到了意外情况不能正常运行，或者不理解为什么这么做，你可以先试着百度一下解决问题，如果还不行可以在下方给我留言，部分问题我也会在后续文章中回答（比如为什么要导入这个依赖，这个依赖的作用是什么），下一篇我很快就写，敬请期待！

码农公寓

创建项目并使用Maven管理

创建Maven项目

整理项目，添加依赖

整理架构

修改pom.xml，添加依赖

修改web.xml版本

在本地Tomcat服务器上运行单机项目

写在最后

相关文章