您的位置:首页 > 编程语言 > Java开发

安装HTML插件GEF和EclipseHTMLEditor

2017-03-23 11:56 295 查看
一、GEF下载安装

进到网页http://www.eclipse.org/gef/downloads/

点6.2M的那个。会进入下载页面

http://www.eclipse.org/downloads/download.php?file=/tools/gef/downloads/drops/3.7.2/R201201171043/GEF-ALL-3.7.2.zip

点击红色框内链接下载,链接地址如下:

http://www.eclipse.org/downloads/download.php?file=/tools/gef/downloads/drops/3.7.2/R201201171043/GEF-ALL-3.7.2.zip&url=http://download.actuatechina.com/eclipse/tools/gef/downloads/drops/3.7.2/R201201171043/GEF-ALL-3.7.2.zip&mirror_id=385

GEF-ALL-3.7.2.zip解压出来

把features目录下的全部拷贝到eclipse/features下,把plugins目录下的文件全部拷贝到eclipse/plugins下。

 

二、安装EclipseHTMLEditor

进入页面http://sourceforge.jp/projects/amateras/downloads/51002/tk.eclipse.plugin.htmleditor_2.1.0.jar/

点击红色框内下载地址,链接地址如下:

http://sourceforge.jp/frs/redir.php?m=iij&f=%2Famateras%2F51002%2Ftk.eclipse.plugin.htmleditor_2.1.0.jar

把该文件tk.eclipse.plugin.htmleditor_2.1.0.jar拷贝到eclipse/plugins下。

 

三、重启Eclipse

菜单选择File->New->Other->Amateras->html新建html文件

注:plugins下没有tk.eclipse.plugin.htmleditor_2.1.0.jar就没有Amateras选项

点“Next“

点“Finish”,自动创建文件内容,

然后在输入一个<符号,自动出来相关的HTML标记供选择,非常方便.

 

 

 

 

 


安装JS插件Spket

一、安装Spket

第一种方法:网上更新方式

1.插件首页:http://www.spket.com

2.插件名称:Spket IDE

3.更新连接(Update Site):http://www.agpad.com/update

更新安装方法:

1.【Help】-【Install New Software】 

2.点击【Add】

3.在【Add Repository]】的【Name】中输入一个名称(什么名称都行),【Location】中输入http://www.agpad.com/update --> 【OK】

4.选择【Spket IDE】-【Next】-【Next】

5.选中【I accept the terms of the license agreements】-【Finish】

安装完之后,要求重启Eclipse。

 

二、配置Spket

注意:如果在安装spket过程中,你的eclipse或者Myeclipse是打开的,请重启eclipse或者Myeclipse。以便初始化插件,下面才会在Preferences中看到 Spket选项。

基本步骤如下:

1)【Windows】→ 【Preferences】 → 【Spket】

可以看到,默认是没有授权的,需要破解,

到网上搜索“spket1.6.23破解补丁”,将刚下载的com.spket.ui_1.6.23.jar替换plugins目录下原来的com.spket.ui_1.6.23.jar即可。重启Eclipse,再次进到【Windows】→ 【Preferences】 → 【Spket】。

说明破解成功。

三、JS代码智能提示测试

这时已经支持JS的语法智能提示了。选择菜单New-àFile建立一个test.js文件,

点“Finish”自动进入代码编辑界面,智能提示效果.

如果没有出现智能提示,需要设置js默认打开方式: Window → Preferences → General→ Editors→ File Associations页面的Associations editors 更改为Spket JavaScript Editor (把spket设为js默认的编辑器)。

或者可以在打开js的时候右键设置打开方式(Open With) 为 Spket JavaScript Editor(default) (把spket设为js默认的编辑器)。
新建*.js 就可以使用"." 或者Ctrl+.或者Alt+/或者Alt+.进行提示了;
如果是在jsp上面写JS进行提示使用快捷键shift+alt+/


 

 

 

 


安装ExtJS插件

在上面安装好Spket的基础上,接着配置

一、【Spket】→ 【JavaScript Profiles】 → 【New】, 输入“ExtJS”点击OK; 

二、选择“ExtJS” 并点击“Add Library”然后在下拉条中选取“ExtJS”;

三、选择 “ExtJS”并点击“Add File”,然后在你的./ext-2.x/source目录中选取“ext.jsb” 文件

(注意:官网新版本里已经没有ext.jsb文件,需要从网上寻找ext-jsb-3.0.0.zip替换ext.jsb)

《Ext JS 4.0在eclipse/myeclipse中使用spket插件设置自动提示的方法》

http://hi.baidu.com/lyw596517091/blog/item/c5314f6f2977cbe8f636545c.html

解决方法:

在网上下载一个叫ext-jsb-3.0.0.zip的文件,我在http://ishare.iask.sina.com.cn/f/19219739.html?f里找到了,下载地址为http://119.147.148.26/6/ishare.down.sina.com.cn/19596728.zip?ssig=eUt7ruWwSb&Expires=1338739200&KID=sina,ishare&ip=1338600134,219.134.165.&fn=ext-jsb-3.0.0.zip,下完后解压开来,把里面的ext.jsb文件复制到Ext
JS目录的src文件夹下(注:这里一定要放对,不然也是不会自动提示),然后按照上面的步骤做。

添加完ext.jsb后的效果如下图:

四、设置新的ExtJS Profile,选中并点击“JavaScript Profiles” 对话框右手边的“Defalut”按钮;

五、重启Eclipse,创建或打开JS文件并输入: Ext这样就可设置Ext Code代码自动完成的功能(注意使用Spket JavaScript Editor打开)。

 

 

 

 

 


Jquery代码智能提示

一、下载jquery

先从http://docs.jquery.com/Downloading_jQuery下载一个 jquery-1.6.2.js的版本,然后参考前面ExtJS的步骤,添加Jquery的Profile

二、自定义静态函数

a)自义js,CommMethod.js

/**

* 通用方法

* @returns {CommMethod}

*/

function CommMethod (){

this.isEmpty=function(str){

return CommMethod.isEmpty(str);

}

}

/**

* 为空检查

* @param {} str

* @return {Boolean}

*/

CommMethod.isEmpty=function(str){

if(str==undefined||str==null||str=='null'||str==''){

return true;

}

return false;

}

/**

* get非空数据

* @param {} str

* @return {Boolean}

*/

CommMethod.getNotNull=function(str){

if(this.isEmpty(str)){

return '';

}

return str;

}

CommMethod.trim=function(str) {

return str.replace(/(^\s*)|(\s*$)/g, "");

}


 

b)配置CommMethod.js到spket里

c)开发中代码使用效果,代码自动提示及辅助输入

d)注意事项,

生效说明:需重启eclipse,且每次新增CommMethod.js函数时也需重启eclipse,否则可能不起作用。

 

三、类方式使用

a)自定义js,map.js

/**

* javascript map

*/

function Map() {

this.elements = new Array();

//获取MAP元素个数

this.size = function() {

return this.elements.length;

}

//判断MAP是否为空

this.isEmpty = function() {

return (this.elements.length < 1);

}

//删除MAP所有元素

this.clear = function() {

this.elements = new Array();

}

//向MAP中增加元素(key, value)

this.put = function(_key, _value) {

this.elements.push({

key : _key,

value : _value

});

}

//删除指定KEY的元素,成功返回True,失败返回False

this.remove = function(_key) {

var bln = false;

try {

for (var i = 0; i < this.elements.length; i++) {

if (this.elements[i].key == _key) {

this.elements.splice(i, 1);

return true;

}

}

} catch (e) {

bln = false;

}

return bln;

}

//获取指定KEY的元素值VALUE,失败返回NULL

this.get = function(_key) {

try {

for (var i = 0; i < this.elements.length; i++) {

if (this.elements[i].key == _key) {

return this.elements[i].value;

}

}

} catch (e) {

return null;

}

}

//获取指定索引的元素(使用element.key,element.value获取KEY和VALUE),失败返回NULL

this.element = function(_index) {

if (_index < 0 || _index >= this.elements.length) {

return null;

}

return this.elements[_index];

}

//判断MAP中是否含有指定KEY的元素

this.containsKey = function(_key) {

var bln = false;

try {

for (var i = 0; i < this.elements.length; i++) {

if (this.elements[i].key == _key) {

bln = true;

}

}

} catch (e) {

bln = false;

}

return bln;

}

//判断MAP中是否含有指定VALUE的元素

this.containsValue = function(_value) {

var bln = false;

try {

for (var i = 0; i < this.elements.length; i++) {

if (this.elements[i].value == _value) {

bln = true;

}

}

} catch (e) {

bln = false;

}

return bln;

}

//获取MAP中所有VALUE的数组(ARRAY)

this.values = function() {

var arr = new Array();

for (var i = 0; i < this.elements.length; i++) {

arr.push(this.elements[i].value);

}

return arr;

}

//获取MAP中所有KEY的数组(ARRAY)

this.keys = function() {

var arr = new Array();

for (var i = 0; i < this.elements.length; i++) {

arr.push(this.elements[i].key);

}

return arr;

}

}


 

b)配置map.js到spket里

c)开发中代码使用效果,代码自动提示,及智能提示

d)注意事项:

生效说明:需重启eclipse,且每次新增map.js函数时也需重启eclipse,否则可能不起作用。

 

通过以上方式,就可以使自定义的js代码跟jquery库一样像java开发一样有自动提示,从而方便开发,并可使javascript的代码按类来处理。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  eclipse插件