这里配置个适合我自己的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