PS:从eclipse刚转到IDEA，对于这个陌生的工具我表示无言，但听说很好用，也就试试，结果我几乎花了一晚上的时间才搭起来maven web项目，觉得在此给各位一个搭建maven web项目的教程，指出我踩过的各种坑！

步骤一：首先先创建一个project,在这里就是创建一个maven的工作空间



步骤二：按照下面的步骤操作就可以了，最后next

首先，选择左边的maven

然后在右边Creater from archetype选项前面打个勾，

最后选择maven-archetype-webapp（这里不知道是我IDEA的问题还是什么原因，我打webapp搜索它只给出第一个，所以在这个坑上耗了几乎1个小时，都选择了第一个）



步骤三：就简单了，填写你的GroupId跟ArtifictId（瞎写都没问题，当然不建议哈，这里GroupId一般写公司名，ArtifictId一般我写项目名）



步骤四：配置自己的maven，然后next



 

步骤五：直接finish，没什么坑哈



 

步骤六：喝杯咖啡，泡杯茶稍安勿躁，等一等（此时目录结构还没出来，我好几次这里没等就百度乱整，直接整坏了）

ps:由于有些idea设置问题可能不会自动导入jar包，这个时候点击右下角的提示Import Changes就可以导包拉



 

步骤七：等出结果，如果目录结构还不出来直接按图操作一波



步骤八：项目的基本目录结构出来后我们最后还需要为项目配置下编译路径还有artifact，按图操作把



出现下图（如果Modules里面已经生成web项目，且之后得Artifacts里面也不是空的，则直接到步骤九）



接着设置Artifacts



选择我们的项目



到了这里再配置tomcat跑下基本就ok了！

步骤九：配置Tomcat，上面目录结构都出来了基本就没有坑了，现在我们给它配置个tomcat---按图操作吧



出现这个画面，然后按图再操作一波



接着出现这个画面，继续看图操作



然后你选择右边第二个选项，Deployment，还是看图操作。。。



最后点击ok完成Tomcat配置，现在就可以启动tomcat跑跑我们的helloWorld了！

 

步骤十：启动tomcat，看效果



启动完idea一般会自动通过默认浏览器打开http://localhost:80/,如果没有就直接在直接的浏览器打这个地址，注意我这里tomcat自己设置了80端口



 

ps:我第二次搞的时候遇到端口被占用的情况也顺带贴出来，自己看图操作把

1.调出系统cmd窗口

2.通过netstat -ano|findstr 1099查询是哪个pid占用了端口

3.通过taskkill /f /t /im 13120直接结束掉占用端口的进程，搞定...



"有用打个赏吧"



 

web前端到底是什么？


某货： “前几年前端开发人员鱼目混杂，技术参差不齐，相对学习起来不规范，导致> 前端开发人员聚集，所以现在前端工种和工资还是没得到普遍重视，但近2年来，> > HTML5、JS 的流行，让前端异常火爆，以后还会更有前途吗？请问您怎么看？”


我





“我只能告诉你：前端不灭”

“除非你不要脸！”

“前些年因为国内都不要脸，然而现在都明白了用户体验至上，现在都要脸；”

“不但要脸 还要胸大 活好！用着舒服”

“后端提供床，前端提供颜值高的妹，你说重要吗？”


某货：“嘿嘿！你意思是 地上、厨房都可以，但没妹子怎么行？。。【大大的 污 】”




上面对话，是我前两天在群里 一段解答的对话。

有人问我 为什么你举例这么生动，真实，让人看了觉得更激情了。我只能告诉你：我主业是段子手，副业才是code，你表 搞错好吗？

好，下面我来简单粗暴的介绍下我自己：3个特征而已


我 最 帅！
	
我 最 帅！
	
我 最 帅！


O(∩_∩)O 好了，我们已经相识了，我们进入相知的阶段（我擦，太快了吧？）

在我讲段子之前呢，我有必要和责任解释下：
｛“ web前端开发 ”是什么？ ｝

｛“ web前端开发 ”有前途吗？｝

｛“ web前端开发 ”到底怎么学？｝

这3个对象，是你入【前端】这个坑的初恋，对！没错同时和 3个对象谈恋爱（我知道你大学肯定干过额 【邪恶脸】）。



NO 1： web前端开发 ”是什么？

前言：声明啊，我是个草根派，不是学院派；那些一篇噼里啪啦，噼里啪啦的各种定义 和术语解释，你在我这么帅的人的系列文章里，根本看不到 嘿嘿！




【啦啦啦 啦啦啦， 我是卖报的小行家，不怕苦，不怕累。。】。。。画风突变


跑题啦！不过话说回来，这个脍炙人口的儿歌，深刻反映了我们 web前端行业的一个工种状态。行家，自由，但要经历苦、累 才会有收获。其他行业，苦、累居多，而我们大前端那必须是自由，乐趣，随心所欲的一个工种。

本帅的感触：做任何一件事，如果是兴趣使然，那必定会坚守到老，从菜鸟变大神也是顺理成章的事儿。因为你的经验会随着你的颜值经历时间的洗刷，最后你回头会发现一件最有意义的事：

我擦，加薪了！ (^o^)/YES!

废话了这么多，我们来步入正题：其实web前端这个职位，并没有一个有效的历史记录可以查询，更没有一个明确的定义，她不像java 攻城狮、c++开发这种一开始就有明确定位的工种一样，是有核心技能可以描述的。比如java开发，顾名思义就是利用java程序来开发功能，php开发：利用php做个商城等等。



前端小美女

你会发现：我们前端这个姑娘，她甚至没有一个logo 和拟人化的图形用来描述（是不是挺扯淡的？）不过不要紧，下面让帅的人 来为她正名。O(∩_∩)O~

一、web前端的演变


Web前端开发工程师是一个很新的职业，在国内乃至国际上真正开始受到重视的时间不超过10年。Web前端开发是从网页制作演变而来的，名称上有很明显的时代特征。在互联网的演化进程中，网页制作是Web 1.0时代的产物，那时网站的主要内容都是静态的，用户使用网站的行为也以浏览为主。

2005年以后，互联网进入Web 2.0时代，各种类似桌面软件的Web应用大量涌现，网站的前端由此发生了翻天覆地的变化。网页不再只是承载单一的文字和图片，各种丰富媒体让网页的内容更加生动，网页上软件化的交互形式为用户提供了更好的使用体验，这些都是基于前端技术实现的。

随着WEB2.0概念的普及和W3C组织的推广，网站重构的影响力正以惊人的速度增长。




前端飞速发展



上边一段标注解释，是某科的一些附录，（这么枯燥的东西，就让别人来总结吧对么？）大概阐述了，以前的web是怎么一种状态和Web2.0的重要性。

其实中国的“web前端开发攻城狮”这个职位好多人并不知道是怎么叫出来的，那么我偷偷 <(￣︶￣)>告诉你：其实是淘宝团队，发明出来的本土化的名称，因为历史原因，淘宝在2005以后迅速崛起，并且爆发式的访问量，让淘宝网的用户体验受到巨大考验和急需前进。

然后淘宝官方第一次有了【 web前端开发 】这个字眼和招聘职位，或许其他网站也想到了这样一种描述，但是毕竟知名度巨高的淘宝，受关注度自然高，口碑相传，就把【前端开发】这个叫法发扬光大了。

在早期点Web前端不叫前端，而是被亲切的叫做“网页设计师”，没错你没看错，就是这个名字，我记得那时候 【网页三剑客】的说法满天飞，你掌握了这3贱客，真的很贱，就可以被人叫做网页设计师了。

网页三剑客：DW\FW\Falsh



网页三剑客

网页三剑客（Flash、Dreamweaver、Firewoks) 并称为Macromedia的网页制作三剑客，由于是同一公司的产品，因而在功能上有着一个非常紧密的结合 。后来Firewoks被Adobe这个变态的巨头收购以后，ps就基本取代Firewoks来做设计网页的工作了，虽然我知道现在还有人用，估计是一种怀念和某些好用的切图功能吧。

而那时候的网页设计师 如果要入此道，必须要掌握的就是Dreamweaver，并不是说只有他能写html 和 css ，而是它在当时的自动提示实在太好用、太强大了，简直不用费脑细胞，你就可以轻轻松松的完成你所想。在当时前端工具和编辑器贫乏的时代，这个绝对是神奇级别了（当然后来 写的多了都熟悉基本不用提示的）。当年还有很多基于Dreamweaver构建网站的教程，那时候真的是个基情满满的年代，这些工具类的历史产物，有兴趣的朋友可以去了解一下就好了，我们不在多舌。

二、web前端开发入门，需要掌握哪些基础


虽说这个问题很大，但是这个话题就很好回答了；因为现在前端如此眼花缭乱，技能多多，都是基于此三板斧：
HTML、CSS、JavaScript




W3C



语言基础：HTML、CSS、JavaScript

思想标准：W3C标准


W3C万维网联盟创建于1994年，是Web技术领域最具权威和影响力的国际中立性技术标准机构。到目前为止，W3C已发布了200多项影响深远的Web技术标准及实施指南，如广为业界采用的超文本标记语言（标准通用标记语言下的一个应用）、可扩展标记语言等，有效促进了Web技术的互相兼容，对互联网技术的发展和应用起到了基础性和根本性的支撑作用。


所以 我们现在运用的html 超文本标记语言，css 等所有基于web技术的范畴，基本都是w3c标准，并全世界统一执行的，所以符合w3c 也就是开启前段之门了。

web前端，首先不是孤立存在的，前端相对于web后端编程而言，前端是浏览器自身支持的编程语言，包括html,css,javascript

HTML： 是构成网页展示的基础，是一种很简单可视化的标识语言，说白了就是 一是一，你写二就出二。网上所有的网页网站，不管多么牛鼻最后都会转化成html，被浏览器渲染出来，用作展示。

CSS： 又称作样式表，简单点说就是html的外衣，将html包装的明艳动人。

JavaScript：是一种直译式脚本语言，非常灵活，可以在任何浏览器上开发与调试的一种动态类型、弱类型、基于原型的语言。

（关于js这个让人又爱又恨的语言，我们到后面会着重介绍和学习，因为掌握此技能， 你就拥有了全世界，说全世界是扯淡的，说白了拥有了 money和妹子）

NO 2： web前端开发 ”到底有前途吗？

如果你在2012年以前 这么问，或许很多人会思考一下，给你说不知道，应该没后端编程有前途吧，或者直接说，web前端有啥啊？不就写个网页、js吗？工资又低。。。。





但现在是2016年了亲，我只能说以后都会是前端年，很久以前不懂web前端的人观念大概是：


xx是美工，让他弄个网页过来

xx你好，你能给我切割按钮过来吗，我后面需要用

xx你alert一下，看我数据传过去了没。

xx xx xx 的


xx你麻痹啊xx！不要叫我美工，谁叫我跟谁急；不要叫我页面仔，虽说每个扎实的前端都是页面仔过来的；更不要侮辱我的职业，以为前端只是写页面、切图。。



然而现在的真实情况是这样的：

hi，小北你这个是什么效果啊，这么牛，css3 html5做的？【css3 html5 笑而不语】

我擦，这，这 怎么自动就刷新了，吓我一跳啊，我还拉回切换着f5呢【gulp、 webpack等构建工具笑而不语】

哎呦，js真牛逼啊，连后台数据库都能操作了，服务器都能构建了【nodejs笑而不语】

哥，你需要什么形式的json串啊， 我这边好生成一下，哥，你过来看一下这个体验怎么样？【老子 不笑，也不会语。尼玛要累死我？】





随着html5的普罗天下，css3的风靡全球，随着nodejs 的崛起，JavaScript这个最容易被人误解的语言，终于散发了它本该有的光芒（不要以为是我抄的别人的话，本篇文章纯属原创，我就是这么有才！）





Javascript这个牛鼻的历史产物，现在真的可以说是万能的，至少在web层面是这样，交互、效果、数据操作、娱乐游戏、操作文件io等等。


由于现在是web应用时代，各种尺寸的电子设备，增长式的爆发，只要和屏幕有关的 就是颜值，颜值代表了一切，你说前端有前途吗？

html5、网页游戏风靡全球，需要页面展现的东西 都是前端范畴，你说有前途吗？





目前世界上最多的可视化物质是什么？蚂蚁？人？还有人说是TT（泥煤，亏你想的出来），那么我告诉你，是网页，网页 ，网页，据统计现在全世界 有亿级别的网页，请问什么概念，你说有前途吗？

最直观的：前端的工资 从前几年的平均几K 到现在的10 20 k 。




前端工资比例图


你说有前途没?

由于本篇文章是 我 前端系列文章的第一篇，只介绍下历史原因 和 为前端正名，并且有效提升初学者和怀疑者的兴趣，所以一些名词的介绍和意义，大家先自行谷歌、度娘一下，后面我们会一一道来。

NO 3： web前端开发 ”怎么学习，怎么入门？

想知道吗？嘿嘿，我好累，喝口水把个妹，想知道，持续关注我帅帅的颜值，下回分解！



在最后，特别感谢，贺贺妹子（傻），辛苦整理提供一些资料和配图，让我的文章更加生动和有趣。我想她一定是被我的颜值折服了吧！



 

----------------------------------------------------------------------------------------------

 

web前端入坑系列：点击标题进入

第一篇： web 前端入坑第一篇：web前端到底是什么？有前途吗

第二篇： web前端入坑第二篇：web前端到底怎么学？干货资料！

第三篇：web前端 | 一条“不归路” -  学习路线！

 

 

入坑方式：   欢迎加入~！气氛热情，欢乐多，妹子多！

 

 

 扫描屏二维码或直接搜索，可以关注 我的前端公众号 ：前端你别闹

听说妹子挺多的，及时更新一些前端解惑和段子





 

关注公众号【江南一点雨】，专注于 Spring Boot+微服务以及前后端分离等全栈技术，定期视频教程分享，关注后回复 Java ，领取松哥为你精心准备的 Java 干货！


前面两篇博客中我们简单介绍了Spring Boot项目的创建、并且也带小伙伴们来DIY了一个Spring Boot自动配置功能，那么这些东西说到底最终还是要回归到Web上才能体现出它的更大的价值，so，今天我们就来看一下如何使用Spring Boot来开发Web项目。当然，如果小伙伴对Spring Boot尚不熟悉的话，可以先参考一下这两篇博客：

1.初识Spring Boot框架

2.初识Spring Boot框架(二)之DIY一个Spring Boot的自动配置

Spring Boot 提供了spring-boot-starter-web来为Web开发予以支持，spring-boot-starter-web为我们提供了嵌入的Tomcat以及SpringMVC的依赖，用起来很方便。另外，我们这里还要用到模板引擎，我们做web开发可选的模板引擎还是挺多的，这里我主要使用Thymeleaf作为模板引擎，事实上，Spring Boot提供了大量的模板引擎，包括FreeMarker、Groovy、Thymeleaf、Velocity和Mustache，在 提供的这么多中它推荐使用Thymeleaf。Thymeleaf在使用的过程中通过ThymeleafAutoConfiguration类对集成所需要的Bean进行自动配置，通过ThymeleafProperties来配置Thymeleaf，包括前缀后缀什么的，我们可以查看ThymeleafProperties一段源码：
@ConfigurationProperties("spring.thymeleaf")
public class ThymeleafProperties {
    private static final Charset DEFAULT_ENCODING = Charset.forName("UTF-8");
    private static final MimeType DEFAULT_CONTENT_TYPE = MimeType.valueOf("text/html");
    public static final String DEFAULT_PREFIX = "classpath:/templates/";
    public static final String DEFAULT_SUFFIX = ".html";
    private boolean checkTemplate = true;
    private boolean checkTemplateLocation = true;
    private String prefix = "classpath:/templates/";
    private String suffix = ".html";
    private String mode = "HTML5";
    
    ......
    ......
    ......
}

OK，从这一段源码中我们可以看到默认的页面后缀名为.html，前缀为classpath:/templates/，实际上也就是我们需要把html页面放到resources文件夹下的templates文件夹中。同时我们也看到了要如何修改这个配置，在application.properties文件中以spring.thymeleaf为前缀来配置相关属性。

关于Thymeleaf如果小伙伴们还不太了解可以先看看我在网上找到的这个资料Thymeleaf中文文档最新版。OK，这些算是准备工作了。接下来我们就从项目的创建开始看起吧。

#创建Project

注意创建的时候要选择Thymeleaf作为依赖，这样创建成功的Project中将自动包含spring-boot-starter-web，如下图：

#创建JavaBean

我一会要从后台传递数据给前台页面，数据的载体就是这个JavaBean，如下：
public class Person {
    private String name;
    private Integer age;

    public Person() {
        super();
    }

    public Person(String name, Integer age) {
        super();
        this.name = name;
        this.age = age;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public Integer getAge() {
        return age;
    }

    public void setAge(Integer age) {
        this.age = age;
    }
}

#后台数据构造

在入口类中添加如下代码，由后台向前台页面返回两条数据，一个单个的Person对象，还有一个people对象是一个List集合，集合中放了3个Person对象，到时候我们直接将这两条数据在html页面上显示出来，代码如下：
@RequestMapping("/")
	public String index(Model model) {
		Person single = new Person("aa", 11);
		List<Person> people = new ArrayList<>();
		Person p1 = new Person("zhangsan", 11);
		Person p2 = new Person("lisi", 22);
		Person p3 = new Person("wangwu", 33);
		people.add(p1);
		people.add(p2);
		people.add(p3);
		model.addAttribute("singlePerson", single);
		model.addAttribute("people", people);
		return "index";
	}

这里的代码都很简单，不必我多说了，就是返回给前台页面两个对象，一个singlePerson，一个people，另外，我们的前台页面叫做index.html。

#引入相关的静态文件

这里我使用到了Bootstrap和jQuery两个库，当然这个并不是必须的，只是为了让我们显示的效果更好看一些,静态文件我们要放在src/main/resources/static目录下。
1.Bootstrap下载
2.jQuery下载

放置之后目录如下：


#前台展示页面

刚才小伙伴们都看到了，默认情况下前台页面要放在src/main/resources/templates目录下，so，我们在该目录下新建文件就叫index.html,如下：
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8" />
    <title>Test20</title>
    <link th:href="@{bootstrap/css/bootstrap.min.css}" rel="stylesheet" />
    <link th:href="@{bootstrap/css/bootstrap-theme.min.css}" rel="stylesheet" />
</head>
<body>
<div class="panel panel-primary">
    <div class="panel-heading">
        <h3 class="panel-title">访问Model</h3>
    </div>
    <div class="panel-body">
        <span th:text="${singlePerson.name}"></span>
    </div>
</div>
<div th:if="${not #lists.isEmpty(people)}">
    <div class="panel panel-primary">
        <div class="panel-heading">
            <h3 class="panel-title">列表</h3>
        </div>
        <div class="panel-body">
            <ul class="list-group">
                <li class="list-group-item" th:each="person:${people}">
                    <span th:text="${person.name}"></span>
                    <span th:text="${person.age}"></span>
                    <button class="btn" th:onclick="'getName(\''+${person.name}+'\');'">获得名字</button>
                </li>
            </ul>
        </div>
    </div>
</div>
<script th:src="@{jquery-3.1.1.js}" type="text/javascript"></script>
<script th:src="@{bootstrap/js/bootstrap.min.js}" type="text/javascript"></script>
<script th:inline="javascript">
    var single = [[${singlePerson}]];
    console.log(single.name+"/"+single.age);
    function getName(name) {
        console.log(name);
    }
</script>
</body>
</html>

关于这一段html文件我简单介绍一下，首先通过xmlns:th="http://www.thymeleaf.org"导入命名空间，在后期时候的时候，由于html本身是静态视图，在使用相关属性的时候加上th:前缀可以使之变为动态视图。th:href="@{bootstrap/css/bootstrap.min.css}"表示引用Web静态资源。OK，这是head部分。body部分整体上分为了两大块，第一块显示我那个单独的Person对象，第二部分显示List集合中的Person对象。div的样式这个没啥好说的，照着Bootstrap的官网写就行了，th:text="${singlePerson.name}"表示访问model中singlePerson的name属性，th:if="${not #lists.isEmpty(people)}"表示判断model中的people集合是否为空，th:each="person:${people}"表示遍历people中的元素，这个和java里的foreach差不多，person表示迭代元素。th:onclick="'getName(\''+${person.name}+'\');'"表示添加点击事件，点击事件由JavaScript来处理。th:inline="javascript"这样添加到的script标签可以通过[[${singlePerson}]]访问model中的属性。
如此之后，我们便可以运行我们自己的项目了，然后在浏览器中访问，结果如下：

点击Button也可以在浏览器控制台看到log输出：

OK，perfect！
#Tomcat相关配置

上面几乎没做什么特别的配置，大部分都使用了SpringBoot提供的默认的配置方式。有的时候我们可能需要有一些自定义的配置，比如Tomcat的配置，很简单，和上上篇博客说的基本一致，有两种不同的配置方式：

##在application.properties中配置

直接在application.properties中进行配置即可，如下：
server.port=8081#配置服务器端口，默认为8080
server.session-timeout=1000000#用户回话session过期时间，以秒为单位
server.context-path=/index#配置访问路径，默认为/
server.tomcat.uri-encoding=UTF-8#配置Tomcat编码，默认为UTF-8
server.tomcat.compression=on#Tomcat是否开启压缩，默认为关闭

##在代码中进行配置
@Component
public class CustomServletContainer implements EmbeddedServletContainerCustomizer {
    @Override
    public void customize(ConfigurableEmbeddedServletContainer container) {
        container.setPort(8080);
        container.addErrorPages(new ErrorPage(HttpStatus.NOT_FOUND,"/404.html"));
        container.setSessionTimeout(10, TimeUnit.MINUTES);
    }
}

自定义类实现

EmbeddedServletContainerCustomizer接口，然后设置端口、设置错误请求页面、设置会话超时时间等，大家注意这里的404页面放在src/main/resources/static文件夹下，有了这个之后，当我访问一个不存在的页面的时候就会跳转到404.html页面了。
#SpringMVC相关配置

虽然Spring Boot默认的配置很多情况都可以满足我们的项目需求，可是有的时候我们可能还是会需要更加灵活的SpringMVC配置，这个时候我们只需要自定义类继承自WebMvcConfigurerAdapter，然后使用@Configuration和@EnableWebMvc注解，这样我们会完全屏蔽掉Spring Boot的默认配置，但是正常情况下我们可能只是希望在Spring Boot已有默认配置的基础上再添加一些配置即Spring Boot提供的默认配置和我自定义的配置并存的情况，这个也简单，只需要去掉@EnableWebMvc注解就行了。如下代码：
@Configuration
//@EnableWebMvc//无需使用该注解，否则会覆盖掉SpringBoot的默认配置值
public class WebMVCConfig extends WebMvcConfigurerAdapter {
    @Override
    public void addViewControllers(ViewControllerRegistry registry) {
        registry.addViewController("/hello").setViewName("/hello");
    }

}

至于这个类里边的其他方法我就不再赘述了，有兴趣的小伙伴可以查看我们之前的文章SpringMVC常用配置。
#自定义Favicon
想要自定义favicon很简单，只需要将自己的favicon.ico文件放置到src/main/resources目录下即可，重新运行项目，再看浏览器左上角图标就会变了。如下：

本案例下载地址：
本案例GitHub地址
以上。
参考资料：

《JavaEE开发的颠覆者 Spring Boot实战》第七章

今日，阿怂就为大家带来一篇如何快速通过eclipse导入web项目及Tomcat 部署步骤；具有很好的参考价值，一起跟阿怂过来吧，如若对您有所帮助，别忘了在文章右上角点个赞哦。

一个人可能走的更快，但是一群人会走的更远！你们说，对吗？

第一步：

【1】打开eclipse，单击左上角的File,File–>Import


【2】打开General–>Existing projects into Workspace–>Browse（选择需要打开的项目）；注意：记得勾选下方copy project into project，目的是为了复制一份项目到工作区间，这样就不会造成原项目被修改，如果直接开发那就不需要，直接操作源文件即可。【注意】如果是超大项目，复制项目则耗时比较长！



第二步：

【3】所有不是在自己电脑上开发的web项目，都需要重新配置一下，单击项目右键，打开Projects【快捷键：alt+enter】



【4】打开Java Bulid  Path–>Libralies–>选择JRE System Library [jre 1.8]–>Edit–>选择中间这个Alternate JRE–>选择本地配置的jre版本

【5】继续在Project页面，找到Java compiler  直接选择apply–>Compiler compliance level 选择你自己的版本，我的是安装的jdk1.8，你们的是什么版本就选什么版本；





【6】单击Project Facts -->如下图，java选择自己的jdk版本

直接点击ok，右下角会有进度条编译项目，稍等就行



【6.1】如果是web项目，必须把Dynamic Web Module 勾选上，要不然下方无法选择servers服务！



【7】如果项目包上还有问题，项目上有个红xx，有可能是因为你的Tomcat里的severlt的包没有识别；怎么解决呢？就是在你项目单击右键，打开Project–》选择Java Bulid  Path–>打开Libralies --》选择Add External JARs 打开



找到你安装tomecat解压的那个文件夹，打开子目录下的lib文件夹，找到servlet-api.jar 直接选择打开即可；



选择打开之后，你能看到jar包已经导进来了！



点击Apply，最后点击ok，项目就成功导入了！
【8】调试阶段，针对不同的项目可能会在不同版本的Tomcat下运行，所以如果报诸如的tomcat无法运行的错误，是由于引入了tomcat不匹配本地tomcat版本的servlet.api.jar报错，引用中的是表示当前环境没有配置tomcat8，所以还需要把项目配置成本地安装的tomcat版本

Description	Resource	Path	Location	Type Target runtime Apache Tomcat v8.0 is not defined.	AttendanceManager		Unknown	Faceted Project Problem

具体操作如下：选择本地的tomcat版本；



【9】接着找到servers双击打开tomcat ，打开tomcat的配置项，这个一般都是自动配好的，选择本地服务器，修改以下两个配置项，Tomcat保持启动状态，localhost；记得Server Locations选第二个;最后点击ok，web项目就可以在自己的本地跑起来了。




【9.1】

如果发现没有 server 这个选项，你可以 Windows --》show View --》other --》搜索server ，如下图，最后点击 ok即可!


【10】此时Eclipse将自动生成Servers工程，选择项目，最后点击Finish，大功告成！



【11】等待tomcat启动完成就可以了，就可以在浏览器里输入url，访问web。




❤如果文章对您有所帮助，就在文章的右上角或者文章的末尾点个赞吧！(づ￣ 3￣)づ

❤如果喜欢大白兔分享的文章，就给大白兔点个关注吧！(๑′ᴗ‵๑)づ╭❤～

❤对文章有任何问题欢迎小伙伴们下方留言或者入群探讨【群号：708072830】

❤鉴于个人经验有限，所有观点及技术研点，如有异议，请直接回复讨论（请勿发表攻击言论）。

—————————————————————————————————

版权声明：本文为CSDN博主「大白兔码奶糖」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。

原文链接：https://blog.csdn.net/weixin_43970743/article/details/106670055