到了一家新公司,新的办公电脑,移动工作站哦,配置很酷。需要自己安装编码环境,node.js(http-server)是必须要装的,编辑器个人比较喜欢sublime,现在归纳一下配置流程,ps:本人有点强迫症:必须官方正版,讨厌各种不透明插件。。。

  • 第一步:官网安装,完成后先把证书给验证了,这算是“买”正版了吧
  1. —– BEGIN LICENSE —–
  2. Michael Barnes
  3. Single User License
  4. EA7E-821385
  5. 8A353C41 872A0D5C DF9B2950 AFF6F667
  6. C458EA6D 8EA3C286 98D1D650 131A97AB
  7. AA919AEC EF20E143 B361B1E7 4C8B7F04
  8. B085E65E 2F5F5360 8489D422 FB8FC1AA
  9. 93F6323C FD7F7544 3F39C318 D95E6480
  10. FCCC7561 8A4A1741 68FA4223 ADCEDE07
  11. 200C25BE DBBC4855 C4CFB774 C5EC138C
  12. 0FEC1CEF D9DCECEC D3A5DAD1 01316C36
  13. —— END LICENSE ——
  • 第二步:安装package control组件,然后直接在线安装:
      1. 按Ctrl+`调出console(注:安装有QQ输入法的这个快捷键会有冲突的,输入法属性设置-输入法管理-取消热键切换至QQ拼音)
      2. 粘贴以下代码到底部命令行并回车:importurllib.request,os; pf ='Package Control.sublime-package'; ipp =sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); open(os.path.join(ipp, pf), 'wb').write(urllib.request.urlopen( 'http://sublime.wbond.net/'+pf.replace(' ','%20')).read())
      3. 重启Sublime Text 3。
      4. 如果在Perferences->package settings中看到package control这一项,则安装成功。
  • 第三步:安装各种插件:1、通过"ctrl+shift+p"打开命令面板  2、输入"install package"打开安装插件面板

 Emmet(语法)、html5(h5模板)、Alignment(对齐Ctrl+Alt+A)、html-css-js prettify(格式化Ctrl+Shift+H)、jQuery(提示)、SublimeLinter(高亮)、AutoFileName(找文件)、DocBlockr(模块注释)、SidebarEnhancements(侧边栏)、JSFormat(对齐js,比如cshtml)

  • 第四步:安装功能型插件:

autoprefixer(自动添加浏览器私有前缀)、less(node:npm install -g less  less-plugin-clean-css   sublime:  LESS、LESS2CSS),个人喜欢将自动编译给false掉。

另外 按“F12”在编译器中快速使用浏览器打开,需要安装"view in browser":

1.在SublimeText下打开该路径:preference - 按键绑定-用户

2.{ "keys": ["F12"], "command": "open_in_browser" }

vscode 用户设置:

  1. {
  2. "window.zoomLevel": 0,
  3. "workbench.colorTheme": "Dobri Next -A03- Mirage",
  4. "workbench.startupEditor": "newUntitledFile",
  5. "editor.fontSize": 18,
  6. "prettier.tabWidth": 4,
  7. "editor.formatOnSave": true,
  8. "vetur.validation.template": false,
  9. "scss.lint.vendorPrefix": "ignore",
  10. "scss.lint.unknownProperties": "ignore",
  11. "vetur.format.defaultFormatter.html": "js-beautify-html"
  12. }

  

sublime 官方正版,自己用的插件配置,最轻量级安装流程的更多相关文章

  1. Sublime Text 3下载-汉化-插件配置

    Sublime Text 3下载 不用说是上官方下载地址:http://www.sublimetext.com/3 Sublime Text 3 免费使用方法 Sublime Text 2的时候还有一 ...

  2. vim学习、各类插件配置与安装

    vim学习.各类插件配置与安装 vim 插件 配置 1. vim学习 vim基础学习:根据网上流行基础文章<简明Vim练级攻略>,进阶书籍<vim实用技巧>.注:进阶书籍可以在 ...

  3. vim学习、各类插件配置与安装【转】

    转自:https://www.cnblogs.com/forest-wow/p/6916531.html 1. vim学习 vim基础学习:根据网上流行基础文章<简明Vim练级攻略>,进阶 ...

  4. Sublime Text 2 快捷键 插件配置

    一.前言之前 从设计到前端,有过一段时间是懵懵懂懂的状态,缺乏对整个职业更加深入的了解.后来混迹于各个前端大牛的博客,在各个QQ群里聆听各路大神的经验之谈,坚定了前端之路的信心.一直收藏各类精华的帖子 ...

  5. sublime text3前端开发插件配置以及使用(个人喜爱)

    第一步下载软件接着Ctrl +~ (回车)把下面安装包管理添加到sublimeimport urllib.request,os; pf = 'Package Control.sublime-packa ...

  6. sublime text3安装以及插件配置教程

    http://blog.csdn.net/feizaosyuacm/article/details/54729891 本文是安装的Sublime Text3是portable version(可移动版 ...

  7. 在 Sublime Text 2 中使用 SFTP 插件快速编辑远程服务器文件

    在 Sublime Text 2 中使用 SFTP 插件快速编辑远程服务器文件 开源程序 浏览:29555 2013年05月02日 文章目录[隐藏] 常见的工作流程 SFTP 安装和使用方法 第一步: ...

  8. Sublime Text 介绍、用法、插件等

    个人常用插件: AlignmentBracket Highlighter 此插件能完成括号高亮匹对DocBlockrEmmentNodejsPackage ControlPrefixr   CSS3中 ...

  9. Sublime Text 前端开发常用扩展插件推荐

    Sublime Text 前端开发常用扩展插件推荐 Sublime Text Sublime Text 是程序员们公认的编码神奇,拥有漂亮的用户界面和强大的功能 更重要的是,Sublime Text ...

随机推荐

  1. C# 判断网卡类型以及其他网卡信息

    NetworkInterface[] interfaces = NetworkInterface.GetAllNetworkInterfaces(); foreach (NetworkInterfac ...

  2. markdown写作方法规范参考汇总

    目录 markdown写作方法 markdown规范 补 本文转载自:https://blog.csdn.net/xiaogeldx/article/details/89208074 本文总结了自己的 ...

  3. 散列表(has table、哈希表)

    一. 散列表是什么 是包含映射关系的一种数据结构,可以提高查找效率. 二. 散列函数 1)必须是一致的.假设输入一个单词“banana”,映射的数字是1,那么以后每次输入banana都要映射到数字1, ...

  4. Apex 中操作用户和组

    用户和组概述 Salesforce中对于用户的定义主要体现于两个对象:用户(User)和组(Group).组的成员可以是用户也可以是另一个组. Salesforce中的组可以有多种表示方法,比如队列( ...

  5. iOS---------显示和隐藏状态栏的网络活动标志

    //在向服务端发送请求状态栏显示网络活动标志: [[UIApplication sharedApplication] setNetworkActivityIndicatorVisible:YES]; ...

  6. idea上使用maven入门(二)——本地仓库以及使用maven

    本地仓库: 首先创建完一个项目之后,点击左上角file->setting(建一个文件夹repository,建议创建到maven的外面,主要如果maven需要换版本,方便管理)如下图: ​ ma ...

  7. selenium-弹窗操作(八)

    本次以笔者公告栏的 打赏 弹窗为例 对弹窗中的一些操作进行封装后,在测试中使用 作用:减少对弹窗反复操作时进行定位的麻烦,以后使用中都直接调用即可达到目的 # coding=utf-8 from se ...

  8. 谈谈你对this对象的理解

    理解: 1.this是js 的一个关键字,随着函数的使用场合的不同,this 的值会发生变化. 2.一个总原则:即this指的是调用函数的那个对象. 3.一般情况下,this 是全局对象,可以作为方法 ...

  9. Python生成器、推导式之前襟后裾

    生成器 函数体内有yield选项的就是生成器,生成器的本质是迭代器,由于函数结构和生成器结构类似,可以通过调用来判断是函数还是生成器,如下: def fun(): yield "我是生成器& ...

  10. Python字典、集合之高山流水

    字典dict字典是由大括号{键:值}组成.字典是无序的.字典的键必须是不可变数据类型.不能使用列表作为键,但可以使用元祖作为字典的键.例如: dict_ = {"test":&qu ...