VsCode搭建Java开发环境(Spring Boot项目创建、运行、调试)

源码地址:https://github.com/YANGKANG01/Spring-Boot-Demo

安装扩展

安装如下两个主要扩展即可,这两个扩展已关联 java 项目开发主要使用的 maven、springboot 等所需要的扩展。

开始步骤:

  1. 在 Visual Studio Code 中打开扩展视图 (Ctrl+Shift+X)。
  2. 输入“java”搜索商店扩展插件。
  3. 找到并安装 Java Extension Pack (Java 扩展包),如果你已经安装了 Language Support for Java(TM) by Red Hat,也可以单独找到并安装 Java Debugger for Visual Studio Code 扩展。
  4. 输入“Spring Boot Extension”搜索商店扩展插件。
  5. 找到并安装 “Spring Boot Extension Pack”。安装过程中可能会比较慢,耐心等待即可。

配置 Maven:

点左下角的设置图标 -> 设置,打开设置内容筛选框,输入 maven,然后点击右侧的打开 json 格式 setting:

然后把 maven 的可执行文件路径配置、maven 的 setting 路径配置、java.home 的路径配置,拷贝到右侧的用户设置区域并且设置为自己电脑的实际路径

设置内容如下:

{
    "workbench.iconTheme": "vscode-icons",
    "workbench.startupEditor": "newUntitledFile",
    "java.errors.incompleteClasspath.severity": "ignore",
    "workbench.colorTheme": "Atom One Dark",
    "java.home":"D:\\software\\Java\\jdk1.8.0_60",
    "java.configuration.maven.userSettings": "D:\\software\\apache-maven-3.3.3-bin\\apache-maven-3.3.3\\conf\\settings.xml",
    "maven.executable.path": "D:\\software\\apache-maven-3.3.3-bin\\apache-maven-3.3.3\\bin\\mvn.cmd",
    "maven.terminal.useJavaHome": true,
    "maven.terminal.customEnv": [
        {
            "environmentVariable": "JAVA_HOME",
            "value": "D:\\software\\Java\\jdk1.8.0_60"
        }
    ],
}

如果你的 mvn 更新包速度很慢,建议使用阿里云的镜像速度会快点(修改 maven 的 setting 配置如下):

 <!-- 阿里云仓库 -->
        <mirror>
            <id>alimaven</id>
            <mirrorOf>central</mirrorOf>
            <name>aliyun maven</name>
            <url>http://maven.aliyun.com/nexus/content/repositories/central/</url>
        </mirror>
        <mirror>
            <id>nexus-aliyun</id>
            <mirrorOf>*</mirrorOf>
            <name>Nexus aliyun</name>
            <url>http://maven.aliyun.com/nexus/content/groups/public</url>
        </mirror>
        <!-- 中央仓库 1 -->
        <mirror>
            <id>repo1</id>
            <mirrorOf>central</mirrorOf>
            <name>Human Readable Name for this Mirror.</name>
            <url>http://repo1.maven.org/maven2/</url>
        </mirror>
    <span style="color: rgba(0, 128, 0, 1)">&lt;!--</span><span style="color: rgba(0, 128, 0, 1)"> 中央仓库2 </span><span style="color: rgba(0, 128, 0, 1)">--&gt;</span>
    <span style="color: rgba(0, 0, 255, 1)">&lt;</span><span style="color: rgba(128, 0, 0, 1)">mirror</span><span style="color: rgba(0, 0, 255, 1)">&gt;</span>
        <span style="color: rgba(0, 0, 255, 1)">&lt;</span><span style="color: rgba(128, 0, 0, 1)">id</span><span style="color: rgba(0, 0, 255, 1)">&gt;</span>repo2<span style="color: rgba(0, 0, 255, 1)">&lt;/</span><span style="color: rgba(128, 0, 0, 1)">id</span><span style="color: rgba(0, 0, 255, 1)">&gt;</span>
        <span style="color: rgba(0, 0, 255, 1)">&lt;</span><span style="color: rgba(128, 0, 0, 1)">mirrorOf</span><span style="color: rgba(0, 0, 255, 1)">&gt;</span>central<span style="color: rgba(0, 0, 255, 1)">&lt;/</span><span style="color: rgba(128, 0, 0, 1)">mirrorOf</span><span style="color: rgba(0, 0, 255, 1)">&gt;</span>
        <span style="color: rgba(0, 0, 255, 1)">&lt;</span><span style="color: rgba(128, 0, 0, 1)">name</span><span style="color: rgba(0, 0, 255, 1)">&gt;</span>Human Readable Name for this Mirror.<span style="color: rgba(0, 0, 255, 1)">&lt;/</span><span style="color: rgba(128, 0, 0, 1)">name</span><span style="color: rgba(0, 0, 255, 1)">&gt;</span>
        <span style="color: rgba(0, 0, 255, 1)">&lt;</span><span style="color: rgba(128, 0, 0, 1)">url</span><span style="color: rgba(0, 0, 255, 1)">&gt;</span>http://repo2.maven.org/maven2/<span style="color: rgba(0, 0, 255, 1)">&lt;/</span><span style="color: rgba(128, 0, 0, 1)">url</span><span style="color: rgba(0, 0, 255, 1)">&gt;</span>
    <span style="color: rgba(0, 0, 255, 1)">&lt;/</span><span style="color: rgba(128, 0, 0, 1)">mirror</span><span style="color: rgba(0, 0, 255, 1)">&gt;</span></pre>

配置完成重启 VSCode。

创建 Spring Boot 项目

使用快捷键 (Ctrl+Shift+P) 命令窗口,输入 Spring 选择创建 Maven 项目。 效果如下:

选择需要使用的语言、Group Id、项目名称等,这里选择 Java:

选择 Spring Boot 版本:

选择需要引入的包,引入如下几个包即可满足 web 开发:

DevTools(代码修改热更新,无需重启)、Web(集成 tomcat、SpringMVC)、Lombok(智能生成 setter、getter、toString 等接口,无需手动生成,代码更简介)、Thymeleaf (模板引擎)。

选择好要引入的包后直接回车,在新弹出的窗口中选择项目路径,至此 Spring Boot 项目创建完成。

创建好后 vscode 右下角会有如下提示,点击 Open it 即可打开刚才创建的 Spring Boot 项目。

 项目运行跟调试

项目创建后会自动创建 DemoApplication.java 文件,在 DemoApplication 文件目录下新建文件夹 Controller,新建文件 HomeController.java。效果如下:

Ps:SpringBoot 项目的 Bean 装配默认规则是根据 DemoApplication 类所在的包位置从上往下扫描。所以必须放在同一目录下否则会无法访问报如下所示错误:

启动工程之前还需要配置下运行环境,如下图,点左边的小虫子图标,然后点上面的下拉箭头,选择添加配置,第一次设置时 VS Code 会提示选择需要运行的语言环境,选择对应环境后自动创建 launch.json 文件。

launch.json 调试配置文件如下,默认不修改配置也可使用:

选择对应的配置环境调式项目如下,默认端口为 8080。

启动后可在控制台输出面板查看启动信息,显示如下后,访问:http://localhost:8080 即可。

 最终效果如下:

访问 HTML 页面

在 spring boot 中访问 html 需要引入 Thymeleaf (模板引擎)包,在创建项目时已引用该包这里不需在重复引用。在 resources-->templates 目录下创建 Index.html 文件,效果如下:

html 内容:

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8"/>
    <title>第一个 HTML 页面</title>
</head>
<body>
<h1>Hello Spring Boot!!!</h1>
<p th:text="${hello}"></p>
</body>
</html>

 在 controller 目录下新建 TestController.java 文件,代码如下:

@Controller
public class TestController {
</span><span style="color: rgba(0, 128, 0, 1)">/**</span><span style="color: rgba(0, 128, 0, 1)">
 * 本地访问内容地址 :</span><span style="color: rgba(0, 128, 0, 1); text-decoration: underline">http://localhost</span><span style="color: rgba(0, 128, 0, 1)">:8080/hello
 * </span><span style="color: rgba(128, 128, 128, 1)">@param</span><span style="color: rgba(0, 128, 0, 1)"> map
 * </span><span style="color: rgba(128, 128, 128, 1)">@return</span>
 <span style="color: rgba(0, 128, 0, 1)">*/</span><span style="color: rgba(0, 0, 0, 1)">
@RequestMapping(</span>"/hello"<span style="color: rgba(0, 0, 0, 1)">)
</span><span style="color: rgba(0, 0, 255, 1)">public</span> String helloHtml(HashMap&lt;String, Object&gt;<span style="color: rgba(0, 0, 0, 1)"> map) {
    map.put(</span>"hello", "欢迎进入HTML页面"<span style="color: rgba(0, 0, 0, 1)">);
    </span><span style="color: rgba(0, 0, 255, 1)">return</span> "/index"<span style="color: rgba(0, 0, 0, 1)">;
}

}

Ps: 如果要访问 html 页面注解必须为 Controller 不能为 RestController。否则无法访问。

RestController 和 Controller 的区别:

@RestController is a stereotype annotation that combines @ResponseBody and @Controller.
意思是:
@RestController 注解相当于 @ResponseBody + @Controller 合在一起的作用。
1) 如果只是使用 @RestController 注解 Controller,则 Controller 中的方法无法返回 jsp 页面,配置的视图解析器 InternalResourceViewResolver 不起作用,返回的内容就是 Return 里的内容。

例如:本来应该到 success.html 页面的,则其显示 success.

2) 如果需要返回到指定页面,则需要用 @Controller 配合视图解析器 InternalResourceViewResolver 才行。

3) 如果需要返回 json 或者 xml 或者自定义 mediaType 内容到页面,则需要在对应的方法上加上 @ResponseBody 注解

效果展示如下:

到处基础配置结束,可以愉快的玩耍 Spring Boot!