Web前端开发神器 Intellij IDEA

1前言

在创建项目中,IDEA提供了很多项目模板,比如Spring MVC模板,可以直接创建一个基于Maven的Spring MVC的demo,各种配置都已经设定好了,直接编译部署就可以使用。

最开始自己创建maven web项目时,要么创建一个springmvc项目进行修改,要么创建了一个maven项目(不是web项目),自己添加webapp目录添加配置web.xml文件,以及添加web moudle,配置属性等等。

另外之前总结的几篇Intellij使用文章,里面多多少少都还有点问题,请以本篇为准。

在Intellij 13.1以后的版本创建项目时的界面发生了调整,不过具体步骤都还是差不多的。本文使用的版本为13.1.2,

2创建Maven Web项目

new project——maven——勾选 create from archetype 选中webapp

下一步 (图略)填写项目的 groupId  artifactId version 后Next 出现以下界面

Next后添加项目名称  Finish

第一次使用时,可能需要下载archetype webapp的插件 有时候网络不好 可能需要很长时间 不过以后就好了

刚创建完之后,需要稍等一下,加载相应配置文件,之后如下图所示

此时的项目已经是Maven的 webapp项目了

这个时候IDE还有缓存,需要在右侧Maven project中 刷新一下,加载pom中的配置

(以后在pom中添加jar的依赖后,都要点击maven project的刷新按钮 刷下缓存)

这个时候Maven webapp项目就彻底创建好了  不需要再在project structure进行配置了。

如下两图,都是默认给配置好的,不需要进行修改:

3关于Maven Web项目的配置说明

Project Structure中Artifaces的配置

如上图所示,在Aritifaces中有两个war,一个是war 一个是war exploded,在配置服务器时需要选择war exploded

千万要注意,这两个war都不应该是自己添加的,而是根据maven中的配置自己生成的

之前没有这两个war的时候,我都是自己创建,往往后果就是项目在编译后缺少jar包,依赖的jar没有自动拷贝

其实Intellij中的mavan项目配置,都是依赖于pom中的配置,如果pom中的配置正确,就不需要修改项目的IDE配置

  1. 首先pom要有<packaging>war</packaging>,如果pom中配置了这个,Aritifaces就会有上面的两个war
  2. 其次pom要有<build>  
     <finalName>test</finalName>  </build> 这个关系到上图中的output
    directory中的配置,finalName作为target下的项目目录,以及会创建对应名字的war包(比如test.war)

配置src/main/java

如上图,src/main目录下缺少java目录,我们可以右键创建目录java,然后再modules中配置为sources目录

这样src/main/java图标就变成了蓝色,作为java源代码区了。

时间: 2024-10-07 21:10:29

Web前端开发神器 Intellij IDEA的相关文章

Web前端开发神器--WebStorm(JavaScript 开发工具) 8.0.3 中文汉化破解版

WebStorm(JavaScript 开发工具) 8.0.3 中文汉化破解版 http://www.jb51.net/softs/171905.html WebStorm 是jetbrains公司旗下一款JavaScript 开发工具.被广大中国JS开发者誉为“Web前端开发神器”.“最强大的HTML5编辑器”.“最智能的JavaScript IDE”等.与IntelliJ IDEA同源,继承了IntelliJ IDEA强大的JS部分的功能.

WEB前端开发工具总结

前端开发工具: web前端开发乃及其它的相关开发, 推荐sublime text, webstorm(jetbrains公司系列产品)这两个的原因在于,有个技术叫emmet, http://docs.emmet.io,而这两个对他的支持是: sublime text 是所有编辑器里边支持emmet比较好的的唯一一款. webstorm是所有编辑器里边唯一内置emmet的一款,并且将emmet的精神往前推动的一款. webstorm针对前端er. 他们的详细对比: http://www.36ria

web前端开发分享-css,js工具篇

来源:http://www.cnblogs.com/jikey/p/3607133.html web前端开发乃及其它的相关开发,推荐sublime text, webstorm(jetbrains公司系列产品)这两个的原因在于,有个技术叫emmet, http://docs.emmet.io,而这两个对他的支持是: sublime text 是所有编辑器里边支持emmet比较好的的唯一一款. webstorm是所有编辑器里边唯一内置emmet的一款,并且将emmet的精神往前推动的一款. php

前端开发神器WebStorm--Grunt 搭建环境(03)

通过上一篇前端开发神器WebStorm--自动化工作流(前言),相信大家都Grunt自动化工具有了初步了解. 接下来我就以WROC3000 web为原型,演示一下如何使用Grunt工具提高工作效率,最大程度压缩代码. 1.首先安装node环境 进入官网 下载安装.(记住安装目录) 检测安装成功方法:打开CMD窗口,输入 node --version 会打印出安装的版本号,说明已经安装成功. 2.安装 Grunt 客户端 在CMD 窗口中,切换到node安装盘符,会自动切换到nodejs安装目录.

Web前端开发推荐阅读书籍、学习课程下载

转自http://www.xuanfengge.com/fe-books.html 前言 学校里没有前端的课程,那如何学习JavaScript,又如何使自己成为一个合格的前端工程师呢? 除了在项目中学习和跟着有经验的同事学习,读书也是必不可少的.书中有着相对完整的知识体系,每读一本好书都会带来一次全面的提高. 而如果深一脚浅一脚的学习,写出代码的质量会参差不齐.初学者的首要任务是成为靠谱的熟练开发者,能够稳定的输出有一定质量的代码. 前端技术发展速度特别快,总是涌现出很多新的东西,需要不断的学习

学习web前端之神器sublime text 3

第一次在博客园写博客,以前都是看别人写的技术在自己慢慢的学习.现在想自己把每天学习的东西理解并记录下来,加深下印象以后可以做个回顾.不知道自己能否坚持每周至少写2篇博文. 古话说的好:工欲善其事,必先利其器.所以我们要找到一个神器来帮助我们更好的学习前端开发,要么记事本怎么样?不错是不错估计要写到猴年马月了. 百度一搜,web前端开发利器有很多,比如:EditPlus,Dreamweaver,HBuilder,Webstorm,Aptana Studio,Sublime text,这么多最后我还

Web前端开发人员实用Chrome插件收集

越来越多的前端开发人员喜欢在Chrome里开发调试代码,Chrome有许多优秀的插件可以帮助前端开发人员极大的提高工作效率.尤其Chrome本身是可以登录的,登录后你所有的插件都会自动同步到每一个登录后的Chrome的,非常方便啊. Postman - REST Client Postman是Ajax开发的神器,对于Restful开发方式特别有帮助,可以用来模拟各种请求来测试API的正确性,比如用来模拟Ajax请求.它还支持认证,比如简单的用户名/密码,或者Oauth1.0.Rest Conso

前端基础入门第一阶段-Web前端开发基础环境配置

Web前端和全栈的定义: A.什么是传统传统web前端:需要把设计师的设计稿,切完图,写标签和样式,实现JS的效果,简而言之即只需要掌握HTML的页面结构,CSS的页面样式,javaScript页面的行为(包括页面的效果和整合): B.HTML5时代的大前端:要处理各种端的兼容开发(PC,移动端,各种浏览器).移动APP开发和移动站点开发,Ajax+服务器端技术开发,异步开发和后台的交互.高级设计模式和框架(MVC,AngularJS...).运用自动化工作流(Grunt).网站安全.SEO.测

Web 前端开发学习之路(入门篇)

字数1374 阅读4622 评论0 喜欢49 以前学习过一段时间的web前端开发,整理了一些我看过的/我认为比较好的学习资料(网站.书籍).不要问我为啥没有进阶版,我只是一条产品汪而已,求轻喷.== 以下引用知乎 @李路 的话. 以我的经验,大部分技术,熟读下列四类书籍即可. 入门,用浅显的语言和方式讲述正确的道理和方法,如head first系列全面,巨细无遗地探讨每个细节,遇到疑难问题时往往可以在这里得到理论解答,如Definitive Guide/Programming xx系列实践,结合