Spket: Configurando Eclipse IDE para desenvolvimento com Ext JS e JQuery
Este tutorial irá mostrar como configurar Eclipse IDE para desenvolvimento com Ext JS e JQuery usando Spekt Eclipse plugin.
Uso o Eclipse desde que comecei a brincar com Java. Atualmente uso o RAD (Rational Application Developer – ferramenta da IBM baseada no Eclipse) no trabalho e o Eclipse para projetos pessoais e desenvolvimento de projetos de exemplo aqui para o blog.
O Eclipse é uma ótima IDE, e o que eu mais gosto é o recurso de auto-completar. Infelizmente, só está disponível para as linguagens suportadas pelo Eclipse. Se você também trabalha com desenvolvimento web, provavalmente também trabalha com javascript. E sinto falta de auto-completar para arquivos js. O auto-completar não é por preguiça não, às vezes você não sabe a grafia correta do nome do método e precisa para o desenvolvimento pra pesquisar online – nisso você já perdeu uns 2 minutos de codificação, e atrapalha a produtividade.
Felizmente existe uma solução para isso. você pode usar o Spket Eclipse plugin. Já estou usando por uns dois meses e tenho gostado muito. Já me economizou alguns minutos de pesquisa online!
Então decidi escrever esse tutorial. Espero que seja útil para alguém!
Spket: Configurando Eclipse IDE para desenvolvimento com Ext JS e JQuery
Update para Ext JS 4
Segue screencast mostrando o passo a passo de como configurar o autocompletar com Ext JS 4:
Spket: Configurando Eclipse IDE para desenvolvimento com Ext JS 4 from Loiane Groner on Vimeo.
Update Outubro 2012
Segue versão mais nova do tutorial:
http://www.loiane.com/2012/10/screencast-extjs-4-autocompletar-no-eclipse-com-sencha-eclipse-plugin/
Até a próxima! 
Tentei usar o Spket com o Eclipse PDT no Ubuntu e não rolou. Segui todos os passos, mas nada =\
Loiane, li e reproduzi passo-a-passo o que vc ensinou no Tutprial Spket: Configurando Eclipse IDE para desenvolvimento com Ext JS e JQuery. Porém, depois que marquei terminei as configurações que devem ser feitas em “PREFERENCES” só ficou funcionando o auto complete tradicional do JavaScript. Reproduzi o teste que vc fez no tutorial e não funcionou. Muito meno o JQuery. Vc poderia me ajudar a solucionar este problema?
Se você selecionar tudo não irá funcionar.
Selecione apenas as opções Ext All e Ext Core que terá todas funções do framework no auto complete
Para configurar com o ExtJS 4.0, precisa baixar os arquivos:
// salvar na pasta de plugins do eclipse
http://www.agpad.com/downloads/com.spket.js_1.6.18.jar
// colocar na pasta do extjshttp://www.agpad.com/downloads/ext-4.0.0.jsb2 for Ext JS 4.0.0
Aí funciona direitinho.
Fonte: http://forums.spket.com/viewtopic.php?f=6&t=1866&sid=68c8f1db452d3b80df1abc4af7117a56&start=15
Oi Edgar,
Muito obrigada pela dica!
Hola Loiane, he leido esperando te encuentres bien, escribo especialmente para darte la gracias por tus aportaciones de Ext JS.. y para pedir de tu valioso conocimiento ya que tengo un proble, estoy probando Ext JS 4 con proyectito que FireFox 4 funciona de maravilla pero en IE8 manda el siguiente error, que librerias deberia de usar:
Mensaje: ‘events’ is null or not an object
Línea: 10962
Carácter: 9
Código: 0
URI: http://localhost:8080/proyecto/lib/ext/ext-all-debug.js
Hola Manuel,
Necesito ver el código para analizar el error. Usted me puede enviar, por favor? Esto no es un error de ExtJS, pero en su código.
Gracias,
Loiane
Eu tmb não consegui habilitar o auto-completar. Tentei com a 4.0.0, com a 4.0.2 e com a 3.4.0
verifiquei estes links: http://forums.spket.com/viewtopic.php?f=6&t=1866&start=15, http://www.extjs.com.br/forum/index.php?action=printpage;topic=4987.0, e mesmo assim nada de auto-completar. Alguem passou por este problema e resolvel?
Olá João,
Abriu com o editor específico do spket? Reiniciou o Eclipse antes de usar?
Eu tive que tentar 3 vezes antes de começar a funcionar.
Vou tentar com o Ext 4 e dou um update no post.
[]‘s
Edgar,
Cara se possível explica direito como se fez estou com problemas…
Não existe o arquivo na pasta “pkgs”, voce renomiou o ext-all.js para all.js?
Já tentei até mesmo fazer isso e não funciona já baixei o ext-4.0.2a.jsb2
para a versão do ExtJs-4.0.2a.
Eu não sei mais o que fazer se possível me de uma Luz
João,
Eu estava com o mesmo problema… Coloquei o ExtJS como padrão (default) na configuração do Spket (JavaScript Profiles), por padrão vem o Firefox 1.5. Após isso começou a funcionar “parcialmente” o autocomplete, pois pelo o que vi no fórum do Spket ele deveria ser mais completo, porém já é um começo.
Pessoal, fiz um update no post para Ext JS 4. Espero que ajude.
Olá Loiane.
É a primeira vez que tento configurar o spket.
Fiz todos os passos contidos no update, mas não deu certo.
Acho que você não mencionou que era necessário colocar o “JavaScript Profile” como “Default” pelo fato de no teu Eclipse já estar instalado anteriormente.
Quando fiz isso, deu certo.
Valeu pelas dicas.
Olá Felipe,
Bem lembrado, esqueci desse detalhe!
Obrigada por avisar!
[]‘s
Pessoal tambem fiz tudo certo, conforme está no PostCast, e nada de funcionar… rsss
Bem ai resolvi reniciar a máquina… e tudo funcionou!!
Utilizo Window7 com Helios Release – Build id: 20100617-1415.
[]‘s
Oi Loiane!
Como faço pra baixar o pdf sobre Spket: Configurando Eclipse IDE para desenvolvimento com Ext JS e JQuery?
Obrigado.
Oi Antonio,
É só entrar no link do pdf no scribd e baixar por lá!
[]‘s
Loiane,
Excelente tutorial e muito facil de acompanhar.Por algum motivo não consegui por para funciona. Eu estou usando o eclipse Indigo, spket 1.6.22 e Extjs 4.0.7. Eu só consegui que funcionasse, quando eu executei esses passos de um tutorial da spket:
1.Select the menu item Window > Preferences… to open the workbench preferences.
2.Select the Spket > JavaScript Profile preference page to display the installed JavaScript Profiles.
3.Click the New.. button. In the Name field, type Ext 4 as the name for the new profile. Then click OK.
4.Click the Add Library button. From the Library drop-down list, select ExtJS. Then click OK.
5.Click the Add File button, choose sdk.jsb3 which can be found in build folder.
6.Select the Ext profile created in step 4, click the Default button make it the default profile for all project. The default profile can also be configured per project by using Configure Project Specific Settings… link.
Espero ter sido util.
Olá Fernando,
Esse vídeo está um pouco desatualizado. A spket já tem suporte ao arquivo jsb3 agora!
[]‘s
Consegui. Valeu!
loiane, boa noite, gostaria de umas dicas sobre o wxtjs 4.1
qual IDe vc usa para deseolver?
tem alguma gratis?
o eclipse tem algum plugin para desenvolvimento extjs?
obrigado
Oi Cleiton,
O Spket é um plugin do Eclipse para ExtJS.
Eu não tenho preferência de editor.
[]‘s
Ola Loiane,
Estou tendo dificuldades em na configuração, eu estou usando o eclipse juno e o extJS ext-4.1.1a, sigo os passos do seu tuto, mas quando vou tentar criar um projeto em JS, ele nao aparece, só aparece JAVA. Você pode me ajudar?