Eclipse离线安装Emmet插件

时间:2022-04-16 11:53:02

Eclipse离线安装Emmet插件

近期发现了一个写前端代码很好的一个东西,一个叫做Emmet的工具,这个工具使用仿CSS选择器的语法来生成代码,大大提高了HTML/CSS代码编写的速度,前身就是大名鼎鼎的Zen
coding。先来看张图:

Eclipse离线安装Emmet插件

是不是非常带劲呢,假设能达到图中的效果,对我们开发前端的代码的速度将会有大幅度的提升。

这里仅仅分享怎样在Eclipse中离线安装emmet插件。

1、  假设须要离线安装emmet。须要从官方站点上下载emmet的源代码包。然后导出为我们须要的插件格式,首先登陆ememt的官网。http://emmet.io,然后选择下载的连接。跳转到下载的界面。例如以下所看到的:

Eclipse离线安装Emmet插件

2、  在这里选择Eclipse一项,会跳转到github上。在github上选择, 右側的download zip选项,例如以下图所看到的:

Eclipse离线安装Emmet插件

3、  下载源码之后,然后选择里面的一个io.emmet.eclipse的目录,将这个目录导入到Eclipse的工作空间中,例如以下图所看到的:

Eclipse离线安装Emmet插件

4、  导入完毕后,能够在Eclipse的工作空间中看到这个项目。例如以下图所看到的:

Eclipse离线安装Emmet插件

5、  然后在项目上选择右键Export选项,例如以下图所看到的:

Eclipse离线安装Emmet插件

6、然后选择插件部署的选项,例如以下图所看到的:

Eclipse离线安装Emmet插件

7、然后选择输出的文件夹,例如以下图所看到的:

Eclipse离线安装Emmet插件

8、导出完毕后会在文件夹下生成一个plugins的文件夹,里面有一个所须要的插件文件例如以下图所看到的:

Eclipse离线安装Emmet插件

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvbG9uZ3l1aG9tZQ==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" alt="">

9、最后将这个目录放入到Eclipse的dropins目录下就可以,重新启动Eclipse,假设在首选项里看到Emmet的信息。说明成功安装了。

Eclipse离线安装Emmet插件

10、安装成功后,就能够在Eclipse的编辑器中使用Emmet的语法,更快的编写我们的代码了。

我个人非常喜欢Eclipse中离线安装插件的方式,差点儿每次安装插件的时候都会使用这样的离线安装的方式。不太喜欢在线安装,总认为没有离线安装的方便,假设其它人也须要安装插件。那我仅仅要给他一个插件即可了。

假设须要用MyEclipse,最好将项目导入到MyEclipse中进行导出配置。假设用Eclipse中导出的插件,有些时候无法再MyEclipse中使用。