单体架构项目 后台管理系统 wan字长文 保姆及教学 Vue.js + Element UI 库 + node.js + axios + java +数据库 男女老少皆可使用(二)

简介: 单体架构项目 后台管理系统 wan字长文 保姆及教学 Vue.js + Element UI 库 + node.js + axios + java +数据库 男女老少皆可使用(二)

Maven 仓库



Maven中的仓库是用来存放maven构建的项目和各种依赖的(Jar包)


Maven的仓库分类


本地仓库: 位于自己计算机中的仓库, 用来存储从远程仓库或中央仓库下载的插件和 jar 包。

远程仓库: 需要联网才可以使用的仓库,阿里提供了一个免费的maven 远程仓库。

中央仓库: 在 maven 软件中内置一个远程仓库地址 http://repo1.maven.org/maven2 ,它是中央仓库,服务于整个互联网,它是由 Maven 团队自己维护,里面存储了非常全的 jar 包,它包含了世界上大部分流行的开源项目构件。


9.png


Maven 本地仓库的配置


maven仓库默认是在 C盘 .m2 目录下,我们不要将仓库放在C盘,所以这里要重新配置一下,这里提供了一个本地仓库,将 “repository.rar”解压至自己的电脑上,我解压在D:\software\repository目录下(注意最好放在没有中文及空格的目录下)


在maven安装目录中,进入 conf文件夹, 可以看到一个 settings.xml 文件中, 我们在这个文件中, 进行本地仓库的配置。


8.png


打开 settings.xml文件,进行如下配置如下

将D:\software\repository\repository拿出来,然后配置到本地仓库的位置。


7.png


配置阿里云远程仓库


Maven默认的远程仓库是在国外, 所以下载jar包时速度会非常慢, 这里推荐大家使用我大天朝的阿里云仓库


<mirror>
      <id>nexus-aliyun</id>
      <mirrorOf>central</mirrorOf>
      <name>Nexus aliyun</name>
      <url>http://maven.aliyun.com/nexus/content/groups/public</url>
    </mirror>


6.png


创建Maven项目


IDEA中配置Maven

1.打开IDEA 创建一个新的project


3.png


2.起名为web_work


2.png


3.首先打开IDEA 选择File --> Settings --> 搜素maven,就会看到如下界面

这里指定本地Maven的安装目录 如果bin目录上一级不行的话,就直接写到/bin目录。


1.png


4.修改默认配置配置


e7cca07a90cc4de1a188785645c30e46.png


创建Maven工程


在IDEA中配置好maven后, 接下来我们使用maven去快速的去构建一个 JavaWeb项目


1.project创建好以后, 选择创建module


1890598716674b4db1b4c65d2849351c.png


2.选中创建一个 maven 工程


8594e2dd29e34dfba81d47376dd75658.png


3.点击 Next填写项目信息


7115adf3710740cf9600481160d324fd.png


4.创建好的工程,长这个样子


image.png


src/main/java —— 存放项目的.java 文件

src/main/resources —— 存放项目资源文件,如数据库的配置文件

src/test/java —— 存放所有单元测试.java 文件,如 JUnit 测试类

target —— 项目输出位置,编译后的class 文件会输出到此目录

pom.xml ——maven 项目核心配置文件


Maven工程改造


当前创建的maven项目是一个 普通的Java项目,不是web项目,我们要进行一下改造


1.当前创建的maven项目是一个 普通的Java项目,不是web项目,我们要进行一下改造


e21bbccf7f4544a88f96a32ef077b05b.png


2.选择 project Structure —> facets—> 点击+号 添加web —> 选择当前工程hello_maven


0ef3b304225747f2afa5e1611e6eec13.png


3.修改路径信息


修改前


1442332b9ba64897891a94382f7b19ab.png


4..修改为 我们的 webapp目录

51aa7f4ed5ee4d918fef286ed1711ea0.png


5.点击ok 后,项目就变为了web项目, 在webapp目录下再创建一个 index.jsp,就OK了


9a097b65441e405e9bed396c71c25910.png

相关文章
|
22天前
|
UED
「Mac畅玩鸿蒙与硬件24」UI互动应用篇1 - 灯光控制小项目
本篇将带领你实现一个互动性十足的灯光控制小项目,用户可以通过点击按钮来控制灯光的开关。该项目将涉及状态管理、动态图片加载以及按钮交互,是学习鸿蒙应用开发的重要基础。
38 5
「Mac畅玩鸿蒙与硬件24」UI互动应用篇1 - 灯光控制小项目
|
1月前
|
JavaScript 前端开发 持续交付
构建现代Web应用:Vue.js与Node.js的完美结合
【10月更文挑战第22天】随着互联网技术的快速发展,Web应用已经成为了人们日常生活和工作的重要组成部分。前端技术和后端技术的不断创新,为Web应用的构建提供了更多可能。在本篇文章中,我们将探讨Vue.js和Node.js这两大热门技术如何完美结合,构建现代Web应用。
36 4
|
3月前
|
JavaScript
Ant Design Vue UI框架的基础使用,及通用后台管理模板的小demo【简单】
这篇文章介绍了如何使用Ant Design Vue UI框架创建一个简单的后台管理模板,包括创建Vue项目、安装和使用ant-design-vue、以及编写后台管理通用页面的代码和样式。
Ant Design Vue UI框架的基础使用,及通用后台管理模板的小demo【简单】
|
3月前
|
JavaScript 前端开发 开发工具
使用vue3+element-ui plus 快速构建后台管理模板
本文介绍了如何使用Vue 3和Element UI Plus快速构建后台管理模板的步骤,包括安装Vue 3脚手架、Element UI Plus以及如何全局配置Element UI Plus。然后详细讲解了如何使用Element UI Plus构建布局,包括Header组件、Aside组件和HomeView视图的创建和样式调整,以及App.vue和main.css的修改,最后提供了项目的文件结构图和效果展示。
使用vue3+element-ui plus 快速构建后台管理模板
|
4月前
|
JavaScript 前端开发 API
全栈开发革命来临!Vue.js与Node.js联手,打造前后端无缝对接的奇迹之作!
【8月更文挑战第30天】在Web开发领域,前后端分离与协作至关重要。Vue.js以其轻量级和易用性深受前端开发者喜爱,而Node.js则以高性能和事件驱动特性在后端领域崭露头角。二者结合开启了全栈开发新篇章,通过RESTful API或GraphQL实现高效稳定通信。本文以示例说明如何使用Vue.js和Node.js构建全栈应用,从前端Vue组件到后端Express服务器,展示了数据获取与展示的全过程。这种组合提供了一种高效简洁的全栈开发方案,使开发者能更专注于业务逻辑实现。
277 1
|
4月前
|
API Android开发
Android项目架构设计问题之选择和使用合适的UI库如何解决
Android项目架构设计问题之选择和使用合适的UI库如何解决
53 0
|
4月前
|
开发者 Android开发 UED
打造流畅应用:深入探索如何在Xamarin项目中选择并实现最佳UI/UX设计的实践指南
【8月更文挑战第31天】在数字化时代,UI/UX设计成为应用成功的关键。Xamarin以高效开发和强大兼容性著称,其设计理念“一次编写,处处运行”需充分适应多平台特性,提供一致体验。选择Xamarin.Forms或结合Xamarin.Native可实现跨平台UI设计;遵循各平台设计指南,保持布局一致性和简洁性;通过用户测试不断优化。最终,结合技术和用户需求,打造美观实用的应用,脱颖而出。
58 0
|
5月前
|
前端开发 JavaScript
零基础学 Vue + Element UI 第01步 —— 搭建开发环境、创建项目、修改默认模板、启动项目、访问项目
零基础学 Vue + Element UI 第01步 —— 搭建开发环境、创建项目、修改默认模板、启动项目、访问项目
75 1
|
6月前
|
前端开发 开发工具 数据安全/隐私保护
开源项目推荐-vue2+element+axios 个人财务管理系统
【6月更文挑战第5天】项目简介 vue2+element+axios 个人财务管理系统 是基于 vue2+element+axios 等主流技术栈构建的免费开源的后台管理前端模板。 项目特色 • 简洁易用:无过渡封装 ,易上手。 • 权限管理:用户、角色、菜单、字典、部门等完善的权限系统功能。 • 基础设施:路由、代码规范、Git 提交规范、常用组件封装。 • 持续更新:持续更新,及时跟进最新的技术和工具。 项目预览 登录页面的为动态效果,在刚刷新或者刚进入的时候有个卫星环绕的动画效果,鼠标移动或者悬浮都有不同的动态效果。 首页首次进入效果:
117 1
|
5月前
|
JavaScript
vue项目中升级element ui(含常见报错及解决方案,如表格不显示,el-table无效, “__v_isRef“ is not defined,Use :deep() instead)
vue项目中升级element ui(含常见报错及解决方案,如表格不显示,el-table无效, “__v_isRef“ is not defined,Use :deep() instead)
68 0