sublime text3插件篇

这里配置个适合我自己的sublime text3配置，以作备忘。

（注：内容为网上找的拼凑加个人实践而成，如有雷同，那就雷同吧~）

1、Emmet

强大的代码提示功能，安装无需配置就可以使用。

2、Git

支持sublime text3上的git操作 ，方便管理代码版本。

3、Sass & Sass Build

高亮显示sass代码，提高可读性。

• 按Ctrl+B编译，博主用空的sass可以编译成功，当前目录会出现 [name].css 和  [name].css.map（没啥作用，记录生成css的信息）文件。
• 有写样式的sass编译报错：Error: Invalid charset directive '@charset': expected string.（不清楚声明为什么报错，并且不写声明语句后也是报错的）
• 并且编译后生成文件路径不知道怎么设置，我是用webpack2搭建的项目环境所以也没有去找解决方案，在此留下这个坑，日后 再解决。

github源码上有一句这个：（估计是改sass或者ruby源码以改变生成文件路径）

      If you want to change the default folder of your generated CSS files into another one, you can edit the build:

      Example: Save your CSS files into a css folder: "cmd": ["sass", "--update", "$file:${file_path}/../css/${file_base_name}.css"],

另外，就是windows7下解决中文乱码的问题：

• 找到ruby的安装目录，里面也有sass模块，如路径： C:/Ruby/lib/ruby/gems/1.9.1/gems/sass-3.3.14/lib/sass 

 

• 在这个文件里面engine.rb，添加一行代码Encoding.default_external = Encoding.find(‘utf-8’) 放在所有的require XXXX 之后即可.

4、cssrem

一个CSS的px值转rem值的Sublime Text 3自动完成插件

• 克隆项目   https://github.com/hyb628/cssrem.git
• 进入packages目录：Preferences > Browse Packages…
• 复制下载的cssrem目录到刚才的packges目录里。
• 重启Sublime Text。

参数配置：Sublime Text -> Preferences -> Package Settings -> cssrem

• px_to_rem - px转rem的单位比例，默认为40。
• max_rem_fraction_length - px转rem的小数部分的最大长度。默认为6。
• available_file_types - 启用此插件的文件类型。默认为：[".css", ".less", ".sass"]。
• 我在配置文件 cssrem.sublime-settings里修改了单位比例为100 
• 具体的比例参数还是看个人平时切图怎么设置参数为准。

 5、AutoFileName 
自动补全文件路径。

6、SublimeLinter 
语法检测工具, 可以检测到所写代码的语法错误,并高亮显示错误。

7、DocBlokr 
DocBlokr 帮助你创造你的代码注释，通过解析功能，参数，变量，并且自动添加基本项目, 只要在文档中输入/**然后按一下tab, 就会根据代码自动生成注释。

8、Alignment 
代码对齐插件，进行智能对齐。

9、Node.js 
用于搭建node.js开发环境。

安装之后打开 Preferences > Browse Packages…进入Nodejs文件夹里面：

• 打开Nodejs.sublime-build文件，将代码 "encoding": "cp1252" 改为 "encoding": "utf8" 保存文件；
• 再打开文件“Nodejs.sublime-settings”，将代码 "node_command": false改为 "node_command": "C:\\Program Files\\nodejs\\node.exe" ，将代码 "npm_command": false 改为 "npm_command": "C:\\Program Files\\nodejs\\npm.cmd" ，保存文件
• 本人node.js安装目录为：C:\\Program Files\\nodejs

10、sftp

用于连接ftp服务器修改线上文件

11、侧边栏样式修改

• Ctrl+Shift+P > install package > "theme-Afterglow"。
• 安装完成后，修改preferences > setting，具体配置如下：

{
"color_inactive_tabs": true,
"color_scheme": "Packages/User/SublimeLinter/Monokai (SL).tmTheme",
"enable_highlight": true,
"enable_mathjax": true,
"font_size": 12,
"ignored_packages":
[
"Vintage"
],
"line_padding_bottom": 1,
"line_padding_top": 1,
"tabs_small": true,
"theme": "Afterglow.sublime-theme",
"update_check": false
}

效果如图：

 12、鸡和马一枚，3126版本：

—– BEGIN LICENSE —–
Michael Barnes
Single User License
EA7E-821385
8A353C41 872A0D5C DF9B2950 AFF6F667
C458EA6D 8EA3C286 98D1D650 131A97AB
AA919AEC EF20E143 B361B1E7 4C8B7F04
B085E65E 2F5F5360 8489D422 FB8FC1AA
93F6323C FD7F7544 3F39C318 D95E6480
FCCC7561 8A4A1741 68FA4223 ADCEDE07
200C25BE DBBC4855 C4CFB774 C5EC138C
0FEC1CEF D9DCECEC D3A5DAD1 01316C36
—— END LICENSE ——