下载安装vscode 这里不在讲述安装过程

下载链接:vscode

打开vscode 后,Ctrl + shift + x 打开插件商店

jdk 和maven 没有安装的请先自行安装.

选择安装一下两个插件: Java Extension Pack. Spring boot Extension Pack

以下我也安装了jQuery HTML 和vscode-icon 插件 进行更有好的显示和提示

如果你习惯于eclipse 的快捷键 可进行 如下配置

VSCode 设置eclipse 风格快捷键
【首选项】–>【键盘快捷方式】–>【用于高级自定义打开和编辑 keybindings.json】

[
    { 'key': 'alt+/',  'command': 'editor.action.triggerSuggest','when': 'editorTextFocus' },
    { 'key': 'ctrl+d', 'command': 'editor.action.cutLines','when': 'editorTextFocus' },
    { 'key': 'ctrl+alt+down','command': 'editor.action.copyLinesDownAction', 'when': 'editorTextFocus' },
    { 'key': 'ctrl+alt+up', 'command': 'editor.action.copyLinesUpAction', 'when': 'editorTextFocus' },
    { 'key': 'shift+alt+r','command': 'editor.action.rename','when': 'editorTextFocus' },
    { 'key': 'ctrl+shift+c','command': 'editor.action.commentLine','when': 'editorTextFocus' },
    { 'key': 'ctrl+d','command': 'editor.action.deleteLines','when': 'editorTextFocus' },
    { 'key': 'ctrl+k','command': 'editor.action.addSelectionToNextFindMatch','when': 'editorFocus'},
    { 'key': 'alt+shift+2','command': 'workbench.action.splitEditor'},
    { 'key': 'ctrl+shift+f','command': 'editor.action.format','when': 'editorTextFocus'},
]

使用Ctrl + , 快捷键 打开settings选项

打开settings.json文件

配置Java HOME 和maven

{
    'java.home': '/usr/java/jdk1.8.0_181',
    'maven.executable.path': '/home/XXX/maven/apache-maven-3.5.4/bin/mvn',
    'java.configuration.maven.userSettings': '/home/XXX/maven/settings.xml',
    'workbench.iconTheme': 'vscode-icons',
}

接下来 我是从spring官网构建一个简单的springboot 项目;start.

选择了以war 包打包. 依赖选择了 web devtools thymeleaf 三个

由eclipse 转入VSCode 搭建springboot初步使用记录
将下载下来的zip 文件解压. 该文件夹就是我们的项目.
使用vscode 选择 file -> open folder 打开该文件夹

其中controller 部分为自己创建.

此处贴出代码. 方便copy 哈哈

package com.example.demo.controller;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;


@Controller
public class BaseController{

    @RequestMapping('/index')
    public String index(){

        return 'index';
    }

    @RequestMapping('/list')
    public String list(){

        return 'user/list';
    }

    
    @RequestMapping('/base')
    @ResponseBody
    public String base(){

        return '测试信息';
    }
}

在templates 目录下 我们创建了一个index.html文件

<!DOCTYPE html>
<html lang='en'>
<head>
    <meta charset='UTF-8'>
    <meta name='viewport' content='width=device-width, initial-scale=1.0'>
    <meta http-equiv='X-UA-Compatible' content='ie=edge'>
    <title>Document</title>
</head>
<body>
    首页信息展示
</body>
</html>

使用了thymeleaf模板. 此处为防止严格的html5错误检查 加入依赖和配置

<!--启用不严格检查html-->
 		<dependency>
    		<groupId>net.sourceforge.nekohtml</groupId>
    		<artifactId>nekohtml</artifactId>
    		<version>1.9.22</version>
 		</dependency>

application.properties文件 加入如下配置

spring.thymeleaf.mode=LEGACYHTML5

接下来 点击Run或者使用F5运行应用

#artContent h1{font-size:16px;font-weight: 400;}