IDEA2022版本创建maven web项目(两种方式)最全图文教学

news2025/2/26 22:05:05

IDEA2022版本创建maven web项目

问题发生时间:2022.1.3
问题描述:新版本的idea2022很多人不解的地方就是创建项目之后没有Web文件夹,这让项目创建的过程中产生了困难

提示:环境搭建的过程中请注意细节问题,避免粗心大意导致的错误

文章目录

  • IDEA2022版本创建maven web项目
    • 一、使用骨架方式
      • 1.在idea中骨架创建的结构?
      • 2.使用骨架方式步骤
    • 二、不使用骨架的方式
      • 1.不选择骨架创建的结构?
      • 2.不使用骨架步骤
    • 三、总结

一、使用骨架方式

1.在idea中骨架创建的结构?

骨架可以更快速的给我们创建出项目结构,idea给我们提供了很多的骨架模板,这样说大家还是不太理解。通俗来说就是用它可以更快的生成项目,以下是使用骨架的web项目结构:
在这里插入图片描述
我们用了骨架以后还是发现距离一个完整的项目结构还差了一些东西:Maven Web项目缺失的目录结构,没有java和resources目录,需要手动完成创建补齐。给大家看我最后补全的项目结构:
在这里插入图片描述
往下看看具体的创建步骤吧

2.使用骨架方式步骤

  • 1.创建Maven项目,给项目取好名字

在这里插入图片描述

  • 2.选择自己下载的jdk版本

在这里插入图片描述

  • 3.选择使用Web项目骨架

在这里插入图片描述

  • 4.确认Maven相关的配置信息

在这里插入图片描述

  • 5.完成项目创建

在这里插入图片描述

  • 6.删除pom.xml中多余内容,只留下面的这些内容,注意打包方式 jar和war的区别

在这里插入图片描述

  • 7.目录结果如下:

在这里插入图片描述

  • 8.补齐Maven Web项目缺失的目录结构,默认没有java和resources目录

在这里插入图片描述

  • 9.需要手动完成创建补齐

在这里插入图片描述

  • 10.创建成功

在这里插入图片描述

二、不使用骨架的方式

1.不选择骨架创建的结构?

个人推荐使用不用骨架的创建方式
在这里插入图片描述
无骨架创建方式也是需要一些步骤去补全的,仅仅是上图并未完成一个完整的项目创建,下图是我经过操作以后创建成功的项目结构:
在这里插入图片描述
大家往下看可以看到详细的步骤,完成创建。

2.不使用骨架步骤

  • 1.创建Maven项目

在这里插入图片描述

  • 2.选择不使用Web项目骨架,选择本地的jdk

在这里插入图片描述

  • 3.完成项目的创建

在这里插入图片描述

  • 4.在pom.xml设置打包方式为war

在这里插入图片描述
在这里插入图片描述

  • 5.补齐Maven Web项目缺失webapp的目录结构

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

  • 6.补充完后,调整一下项目结构,最终的项目结构如下:

在这里插入图片描述
至此我们完成了无骨架的创建,大家在创建的时候一定要注意一些提示点,易错点!

三、总结

Maven来创建Web项目,创建方式有两种:使用骨架和不使用骨架
使用骨架

具体的步骤包含:
1.创建Maven项目,给项目取好名字
2.选择自己下载的jdk版本
3.选择使用Web项目骨架
4.确认Maven相关的配置信息
5.完成项目创建
6.删除pom.xml中多余内容,只留下面的这些内容,注意打包方式 jar和war的区别
7.补齐Maven Web项目缺失的目录结构,默认没有java和resources目录

不使用骨架

具体的步骤包含:

1.创建Maven项目
2.选择不使用Web项目骨架,选择本地的jdk
3.完成项目的创建
4.在pom.xml设置打包方式为war
5.补齐Maven Web项目缺失webapp的目录结构
6.补充完后,调整一下项目结构

  • 希望我的贴子能够帮助到更多的人,码字不易,大家给个关注点赞吧~你们的支持让我更加有动力了
  • 新的一年祝大家万事如意!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/405323.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Vue开发实例(20)之实现登录功能

引言 Vue是现在前端最流行的框架之一,作为前端开发人员应该要熟练的掌握它,如果你是打算学习Vue的开发流程,那么来吧,明哥带你快速上手、带你飞! 即使你并非前端开发人员,对前端的开发流程进行一定的了解也…

微信小程序简洁登录页面(附源码)

微信小程序简洁登录页面(附源码) 文章目录微信小程序简洁登录页面(附源码)1. 群聊(开源项目以及技术交流)2.看效果3.用户不存在4.上代码4.1login.wxml4.2login.css4.3login.js5.总结1. 群聊(开源…

手把手教你用vue + node 作后端连接数据库

教程的顺序: 1、编写node服务器 2、用node连接数据库 3、编写前端页面 4、前后端交互 ok,让我们开始吧 1、编写node服务器 先下载几个依赖包 express(用于网络连接) npm i express --save cors(用于处理跨域…

IDEA 2022专业版创建Java Web项目(保姆式小白讲义,强烈建议入手!)

这里先给出IDEA专业版的下载链接,没有下载的小伙伴,请先下载哦!(选择左边的Ultimate) 目录 1.新建Java Class 2.添加框架 3. 配置Maven 4.配置项目结构 5.配置tomcat 本文致力于2022.3IDEA 专业版创建Java Web项目小白…

JS中的this指向

this的概念: 在js中,this的意思为“这个;当前”,是一个指针型变量,它动态指向当前函数的运行环境。 在不同的场景中调用同一个函数,this的指向也可能会发生变化,但是它永远指向其所在函数的真实调用者&…

如何在uniapp中优雅地使用WebView

这里给大家分享我在网上总结出来的一些知识&#xff0c;希望对大家有所帮助 从webview页面传值到uniapp中 官方文档已经很详细了,这里给大家上我的实战代码&#xff0c;首先在webview页面中引入相关依赖&#xff1a; <!-- uniapp各平台依赖 --> <script type"tex…

用uniapp实现微信小程序的电子签名效果

✅作者简介&#xff1a;大家好我是瓜子三百克&#xff0c;励志成为全栈工程师的一枚程序猿&#xff0c;也是喜欢在学习和开发中记录笔记的小白博主&#xff01; &#x1f4c3;个人主页&#xff1a;瓜子三百克的主页 &#x1f525;系列专栏&#xff1a;uniapp前端 &#x1f496;…

vue项目实战-电商后台管理系统

项目简介&#xff1a; 该项目为电商后台的管理系统。设计了登录页面。 管理人员需要通过输入正确的用户名和密码才能登录。登陆成功之后进入管理页面&#xff1a; 管理页面由五个子模块组成&#xff1a;用户管理&#xff0c;权限管理&#xff0c;商品管理&#xff0c;订单管理…

ChatGPT对话数据备份

ChatGPT对话数据备份 文章目录ChatGPT对话数据备份1. 背景2. 其他&#xff08;失败的&#xff09;方法2.1 右键另存为2.2 直接copy html代码3. 编写Javascript脚本3.1 思路过程3.2 安装教程3.3 使用说明3.4 最终效果1. 背景 之前在ChatGPT更新时有好几天都无法查看过往对话&am…

webpack 面试题整理

文章目录webpack 面试题整理谈谈你对Webpack的理解Webpack的打包过程/打包原理/构建流程&#xff1f;Webpack中loader的作用/ loader是什么&#xff1f;常见的loader有哪些&#xff1f;Plugin有什么作用&#xff1f;/Plugin是什么常见的Plugin有哪些Webpack 插件的执行顺序&…

15套前端经典实战项目大合集,小白练手必备实战项目

15套前端经典实战项目大合集&#xff0c;悄悄练习&#xff0c;你会惊艳所有人。 今日我以内卷为荣&#xff0c;明日内卷以我为荣&#xff0c;不管学习哪门语言都要做出实际的东西来&#xff0c;这个实际的东西就是项目。 这里整理了15前端经典实战项目&#xff0c;每套都有完…

nodejs高版本降为低版本方案

1.首先通过控制面板应用卸载当前环境下的Node.js相关安装&#xff0c;并清理磁盘残存的文件夹等文件 2.下载nvm来管理node版本 官网&#xff1a;https://github.com/coreybutler/nvm-windows/releases 说在前面&#xff0c;贴一个error C:\Windows\system32>nvm use 12.10.…

web前端Vue 报错:Uncaught (in promise) TypeError: Cannot read properties of nu

前言 最近在写vue项目 在写自定义分页器的时候报了一个异常 知道错误却一直找不到解决方案 苦思冥想后 还是js的基础语法不扎实导致的&#xff0c;在此记录一下解决方案和思路 为以后的bug解决之路打下基础 错误提示 错误内容Uncaught (in promise) TypeError: Cannot read…

【HTML特效程序】① 给女神表白的程序(让女神看科技烟花),输入名字自动生成表白二维码

目录一、效果演示视频二、一步一步创建项目三、生成表白二维码的小链接一、效果演示视频 给女神表白的程序二、一步一步创建项目 &#x1f339; 在您的电脑上创建 love 文件夹 &#xff08;存放所有的资源和代码&#xff09; &#x1f339; 在 love 文件夹中创建 images 文件夹…

Vue 国际化之 vue-i18n 的使用

目录 一、安装 二、使用 1、准备语言包 2、准备翻译的语言环境 3、实现语言翻译 三、整合 ElementUI 语言包 1、扩展中文 2、扩展英文 3、使用扩展语言翻译 四、问题记录 五、扩展 vue3 中使用 vue-i18n 一、安装 npm install vue-i18n 如果在一个模块系统中使用…

elementUI使用el-upload上传文件写法总结及避坑,上传图片/视频到本地/服务器以及回显+删除

Element Upload 上传 Element Upload官方文档&#xff1a;el-upload 具体细节只看官方文档&#xff0c;本篇主要介绍避坑点和用法总结 注意点以及坑 本地上传想要回显图片视频&#xff0c;使用on-success是没办法再在上传后获取到本地文件路径后进行回显的&#xff0c;因为只…

若依(RuoYi )权限管理设计

前言 若依权限管理包含两个部分&#xff1a;菜单权限 和 数据权限。菜单权限控制着我们可以执行哪些操作。数据权限控制着我们可以看到哪些数据。 菜单是一个概括性名称&#xff0c;可以细分为目录、菜单和按钮&#xff0c;以若依自身为例&#xff1a; 目录&#xff0c;就是页…

TypeScript 学习笔记(十万字超详细知识点总结)

👉 本系列专栏:TypeScript从入门到精通 🖥️ NodeJS专栏:Node.js从入门到精通 📢 欢迎私信博主加入前端交流群🌹 知识目录 一、介绍1、JavaScript最大的问题2、什么是TypeScript3、JS , ES , TS 的关系4、为什么使用TypeScript5、配置TypeScript环境二、数据类型1、基…

下载、编译、安装、使用 vue-devtools

不少人都想下载 vue-devtools插件&#xff0c;但又不会做&#xff0c;今天我做个比较详细的笔记 查看当前的devtools的版本可以去这个网站看右侧的个v几点几的&#xff0c;就是版本号 github/vuejs/devtools 目录 第一个方法&#xff1a;使用极简插件 第一步&#xff1a;查…

Node.js | JavaScript也能写后端?

本文已收录于专栏⭐️ 《深入浅出Node.js》⭐️ 学习指南&#x1f4c3;&#x1f449;引入⭐️初识Node.js⭐️发展历史⭐️应用场景⭐️搭建环境&#x1f449;完结散花&#x1f449;参考文献&#x1f449;引入 如果读者是一个前端开发的同学&#xff0c;不知道你有没有过这样的…