如何在Notepad++ 中成功地安装Emmet 插件

1、双桌面已经安装好的 “Notepad++” 程序,启动Notepad++程序。

2、点开菜单“插件--->Plugin Manager--->Show Plugin Manager”。

3、进入“Plugin Manager”对话框,打开“Available”选项卡,勾选“Emmet”,点右下角的“Install”。

4、因为Emmet 需要 PythonScript 插件的支持。所以默认它会把这两个插件都安装。

5、安装完成后,提示需要重新启动 “Notepad++”,点“是”即可。

6、我们打开一个写有 Emmet 代码的文档测试。点开点开菜单“插件--->Emmet--->Expand abbreviation”。

结果会会依次出现以下两个错误提示:说明“Python Script”安装不正确。所以Emmet 不能使用。

进入 Python Script 插件所在目录,你会发现它里也是空的,没有文件。

7、点开菜单“插件--->Plugin Manager--->Show Plugin Manager”,点“Installed”选项卡。勾选“Python Script”,点“Remove”,在弹出的警告框中选择“是”,移除 “Python Script” 插件。

8、下面我们来解决 “Python Script” 插件的问题,进入网址:http://sourceforge.net/projects/npppythonscript/files/Python%20Script%201.0.6.0/,下载“PythonScript_Full_1.0.6.0.zip”。

下载完成后解压,文件如下:

9、把 PythonScript_Full_1.0.6.0\plugins\docs 文件夹里的 “PythonScript” 的复制到 “Notepad++”  插件安装目录 C:\Program Files (x86)\Notepad++\plugins\doc,如果原文件夹有同名文件夹请覆盖。这是一个帮助文件。

10、把PythonScript_Full_1.0.6.0\plugins 文件夹里的 “PythonScript” 文件夹和“ PythonScript.dll” 文件复制到 “Notepad++”  插件安装目录 C:\Program Files (x86)\Notepad++\plugins,如果原文件夹有同名文件夹或文件请覆盖。

11、把 PythonScript_Full_1.0.6.0 文件夹里的 “python27.dll” 文件复制到 “Notepad++”  安装目录 C:\Program Files (x86)\Notepad++,如果原文件夹有同名文件请覆盖。

12、已经手动安装完成 “PythonScript” 插件,下面我们开始测试。打开 “Notepad++” 程序,新建一个html文件,代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Emmet</title>
    </head>
    <body>
        ul#nav>li.item$*4>a{Item $}
        ul#nav>li.item$*8>a{Item $}
        <ul id="nav">
            <li class="item1"><a href="">Item 1</a></li>
            <li class="item2"><a href="">Item 2</a></li>
            <li class="item3"><a href="">Item 3</a></li>
        </ul>
        <ul id="nav"><li class="item1"><a href="">Item 1</a></li><li class="item2"><a href="">Item 2</a></li><li class="item3"><a href="">Item 3</a></li><li class="item4"><a href="">Item 4</a></li>
        </ul>
    </body>
</html>

13、把光标定在这节代码的后面,点开点开菜单“插件--->Emmet--->Expand abbreviation”。

瞬间就会生成如下图红框中的代码。这只是Emmet 功能的一个小小的示例。更多的功能见其官方网站:http://docs.emmet.io/

14、我们来设置一下 Emmet 功能的快捷键。菜单“设置--->管理快捷键”。

进入快捷键管理页面。打开  “Plugin commands” 选项卡,找到 “Expand abbreviation”,双击后面的  “Ctrl+Shift+Enter”,设置快捷键为 “Shift +Tab”,记得点“Ok”,让更改生效。以后使用 Emmet 功能,就不用菜单了,直接用 “Shift +Tab” 快捷键。

本教程为原创精品教程,转载请注明出处:http://www.cnblogs.com/wind128/p/4445573.html

欢迎加入QQ群 279422298 进行更多交流

时间: 2024-10-13 15:09:46

如何在Notepad++ 中成功地安装Emmet 插件的相关文章

Eclipse离线安装Emmet插件

近期发现了一个写前端代码很好的一个东西,一个叫做Emmet的工具,这个工具使用仿CSS选择器的语法来生成代码,大大提高了HTML/CSS代码编写的速度,前身就是大名鼎鼎的Zen coding.先来看张图: 是不是非常带劲呢,假设能达到图中的效果,对我们开发前端的代码的速度将会有大幅度的提升. 这里仅仅分享怎样在Eclipse中离线安装emmet插件. 1.  假设须要离线安装emmet.须要从官方站点上下载emmet的源代码包.然后导出为我们须要的插件格式,首先登陆ememt的官网.http:/

Sublime Text3开发工具安装emmet插件

第一步:Sublime Text导入Package Control 自动安装: 1.打开Sublime Text -->View --> Show Console 菜单打开控制台 2.粘贴Text3版本的代码后回车安装 适用于 Sublime Text 3: import  urllib.request,os;pf='Package Control.sublime-package';ipp=sublime.installed_packages_path();urllib.request.ins

Sublimetext3安装Emmet插件步骤

看清楚哦~~这是Sublime text 3不是2的版本,两者的安装还是有区别的,下面的方法是我感觉比较简单的,其他的要命令什么的感觉太复杂了,经测试是OK的. 先关闭Sublime text 3: 第一步:下载sublime_package_control-master.zip ,解压命名文件夹为Package Control.(注意大小写) 第二步:下载sublime_package_control-python3.zip,解压后覆盖到刚刚的Package Control中,完成插件API函

sublime text3安装emmet插件

sublime text3如果不能ctrl+p去安装emmet插件, 就安装下面步骤操作: ①关闭Sublime Text 3 ②下载sublime_package_control-master.zip 下载地址:http://files.cnblogs.com/tinyphp/sublime_package_control-master.zip 解压命名文件夹为Package Control   (注意大小写) ③重新启动Sublime Text 3,在选择菜单里面选择:Preference-

解决 TextMate 2 无法安装 Emmet 插件

本篇文章由:http://xinpure.com/solving-textmate-2-cannot-install-emmet-plugin/ 前端神器 Emmet 插件原名为 ZedCoding 前端开发,Emmet 插件是必不可少的开发神器,神奇之处这里就不赘述了. 最喜欢使用的编辑器就是 Textmate 和 Sublime 其实无论是 TextMate 还是 Sublime 安装 Emmet 插件的方法网上比比皆是,也非常简单 然而从 GitHub 找到的 Emmet.tmplugin

快速安装Emmet插件

最近痴迷于sublime的性感不可自拔,然后在了解到Emmet插件的强大之后果断的去寻找Emmet插件来安装,可是在网上搜了大半天都没有特别满意的,最后在github上找到了想要的资源,看了网上的安装步骤之后,喜欢简单粗暴的我觉得方法实在是复杂的让人有种想退缩的欲望,所以就写下这篇文章,和大家分享一下我的安装步骤,不简单不要钱!! 1.首先百度Emmet关键词,出来的第一个词条便是我们要的东西,进入之后是Emmet首页,直接点击sublime然后就会进入github网页中去(全英的表示看不懂啊.

Sublime在Mac统下安装Emmet插件

由于我做iOS入行IT的,近期有学习H5的想法,于是就开始了...... 首先使用Sublime编辑软件,但是每次创建新文件,都需要重新写头文件那一套东西,觉得很不方便,于是就开始装Emmet插件.具体如下: 一.安装插件管理器Package Control 1.打开Sublime控制台 打开Sublime,按下Control + `(Mac)或者Ctrl + `(Windows) 也可以在菜单中选择View > Show Console, 2.根据sublime版本不同粘贴下面的代码 subl

给notepad++安装emmet插件

首先下载并安装notepad++:http://www.baidu.com/s?word=Notepad%2B%2B 然后下载并安装PythonScript:点我下载 接着下载emmet-npp:官方下载 并将其解压缩到C:\Program Files\Notepad++\plugins文件夹中 启动Nodepad ++.你应该看到Plugins > Emmet菜单项. 最后点击 设置 -- 管理快捷键,Plugin commands,把Expand abbreviation后面的快捷键改为你熟

APPCAN IDE中安装emmet插件

1.首先打开APPCAN IDE 2.帮助(help)-安装新软件(install New sofaWare) 3.打开Install窗口,点击 Add,在Add Repository窗口中,Name一览随便输入一个名字,然后再Location中输入 http://emmet.io/eclipse/updates/ 点击确定 4.选中emmet 然后一直next 中途需要等待还有一次需要同意安装的选择 5.下载完毕后,会提示确认安装窗口,点击OK ,等待安装完毕后,需要重启IDE