使用Sublime Text 3的HTML-CSS-JS Prettify插件格式化代码
很多时候,我们想要格式化HTML-CSS-JS代码,网站上有很多实现此功能的小工具,当然,我的网站首页也有。但是,如果我们的代码编辑器上面也有这样的功能,那不是更加快速便捷?So,接下来,我们看看Sublime Text 3是如何使用插件实现此功能的吧!
一、必要条件:
1、首先,你要有Sublime Text 3编辑器;
2、你本地要配置NodeJS环境(安装方法可以参考:Node.js学习笔记之一);
3、你的Sublime Text 3编辑器要安装HTML-CSS-JS Prettify插件(安装方法可以参考:Sublime常用插件总结)。
二、安装过程:
1、我们打开Sublime Text 3编辑器,安装HTML-CSS-JS Prettify插件。
a)在Sublime Text 3中,按下Ctrl+Shift+P调出命令面板;
b)输入install 调出 Install Package 选项并回车;
c)输入pretty,并在列表中选择HTML-CSS-JS Prettify后回车即可安装。
2、查看本地安装的NodeJS配置环境路径(在dos命令下,输入where node并回车)。

3、在编辑器的任意一个html/js/css文件中,右击,出现如下图所示,选择Set Plugin Options。

4、将上述步骤2中的NodeJS本地路径保存到步骤3中打开的文件中,如下图所示。

5、成功安装HTML-CSS-JS Prettify插件。
三、做个DEMO:
1、原始HTML模板,混乱不堪。

2、右击,选择Prettify Code。

3、格式化结果。

使用Sublime Text 3的HTML-CSS-JS Prettify插件格式化代码的更多相关文章
- sublime代码格式化插件HTML/CSS/JS prettify
1. 进入下载链接,安装node.js (根据自己使用版本) https://nodejs.org/en/download/ 注意: 记住node.js的 安装路径 2.sublime HTML/CS ...
- 【前端】Sublime text3 插件HTML/CSS/JS prettify 格式化代码
1.首先安装插件 菜单的preference->packages control,然后输入install .. 回车,再输入HTML/CSS/JS prettify 再回车,重启后就可以了. 2 ...
- Sublime text3 插件HTML/CSS/JS prettify 格式化代码
1.首先安装插件 菜单的preference->packages control,然后输入install .. 回车,再输入HTML/CSS/JS prettify 再回车,重启后就可以了. 2 ...
- sublime text 3将px换算为rem的插件的安装及使用
标签: rem这个单位对于移动端来说是比较强大的,所以这里给大家介绍sublime text 3将px换算为rem的插件的安装及使用,只要安装了这个插件,输入多少px,sublime就会提示相应的re ...
- Sublime Text 2安装汉化破解、插件包安装教程
原文地址: Sublime Text 2安装汉化破解.插件包安装教程_百度经验 http://jingyan.baidu.com/article/ff4116259b057c12e48237b8.ht ...
- Sublime Text 3安装与使用 Package Control 插件安装
原文地址:http://www.cnblogs.com/zhcncn/p/4113589.html 本文是Sublime Text 全程指引 by Lucida (http://www.cnblogs ...
- 在SUBLIME TEXT中安装SUBLIMELINTER进行JS&CSS代码校验
一:Sublime Text 中需要先安装Package Control.(如果有则无需安装) 安装方法:打开Sublime Text控制台(快捷键Ctrl+`),在控制台粘贴以下代码,按回车执行. ...
- sublime Text 3常用Html/Css基础插件安装
前言 sublime以其简洁明了的外观,干脆利落的编辑方式,再加上丰富的功能插件,深受广大开发者的喜爱.今天,我就来介绍几款基于Html/Css开发的sublime插件. 1.Package Cont ...
- 使用Sublime Text 或 vs2017开发Node.js程序
在学习一门开发语言时,为了从简单的方式入手,有时候直接用Notepad开始敲代码.曾经我也这样干过,这样做简洁而不简单啊! 随着时间的流逝,人也变得懒惰起来,做事前总是想借助一些工具来搞事情.< ...
随机推荐
- 解题:HDU 5868 Different Circle Permutation
题面 先往上套Burnside引理 既然要求没有$\frac{2*π}{n}$的角,也就是说两个人不能挨着,那么相当于给一个环黑白染色,两个相邻的点不能染白色,同时求方案数.考虑$n$个置换子群,即向 ...
- (转)在Eclipse中用TODO标签管理任务(Task)
背景:eclipse是一款功能十分强大的编辑,如果能够熟练运用,必定事半功倍,但如果不求甚解,无疑是给自己制造麻烦. 1 标签的使用 1.1 起因 如上图所示,在程序中有很多todo的标签出现,但是却 ...
- centos7下设置opencv环境变量
最近要装YOLO,但是MAKE的时候总是找不到OPENCV的路径, 原因是:我以前卸载过一次OPENCV,然后自己重新安装了opencv2.4.10, 因为当时只在QT 中用,所以编译完也没有设置环 ...
- vue.js初识(一)
vue.js安装 官网:http://cn.vuejs.org/ 官方安装介绍:http://cn.vuejs.org/v2/guide/installation.html MVVM框架:View.V ...
- Golang的文件处理方式-常见的读写姿势
Golang的文件处理方式-常见的读写姿势 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 在 Golang 语言中,文件使用指向 os.File 类型的指针来表示的,也叫做文件句柄 ...
- 用Riffstation扒带
有人说扒带本质就是扒和声 编曲初学者如果是自学的情况下很容易陷入瓶颈,网络上的编曲爱好者大都建议去多扒带,所谓扒带其实就是把别人的编曲自己编出来,然而这要很好的听力,下面我介绍的这款软件就是用来扒和声 ...
- C#string与stringBuilder的区别
string的缺点是每次字符串变量的内容发生了改变时,都必须重新分配内存.你想想,如果创建一个迭代100000次的循环,每次迭代都将一个字符连接到字符串,这样内存中就会有100000个字符串,每个字符 ...
- jQuery下ajax事件的简单分析
昨天写了一篇关于监视页面动态生成元素问题的文章,引起了一些小小的争议,不过我从中学到了很多.文章在这,<jQuery下实现等待指定元素加载完毕>当然 动态生成的节点元素 分很多种情况,这里 ...
- javascript使用事件委托
事件委托是javascript中一个很重要的概念,其基本思路就是利用了事件冒泡的机制,给上级(父级)元素触发事件的dom对象上绑定一个处理函数.在当有需要很多dom对象要绑定事件的情况下,可以使用事件 ...
- javascript构造函数模块
var Person = (function(){ var Constr; Constr = function(){ this.name = 'carl'; } Constr.prototype = ...