第一步:百度搜索sublime text3 ,直接点击红色箭头下方的下载地址,下载完成安装后会提示是否更新,直接点击更新就好了!

第二步:下载插件管理器,点击菜单栏Tools->Package Control,安装完后有提示就说明安装完成!

第三步:安装插件,按下Ctrl+Shift+P调出命令面板,输入install 调出 Install Package 选项并回车。

回车后下方状态栏提示:

等待一会出现以下搜索栏:

 在搜索栏中输入插件名:Emmet,然后回车,下载完会新建一个成功的页面。

Emmet(代码提示插件html/css)一种快速编写html/css的方法,使用方法:(tab快捷键)

接下来按照上面的方法安装一些常用的插件

1、SublimeCodeIntel(作为一个代码提示和补全插件)

2、SublimeLinter (代码检查插件)

3、ColorPicker(调色板(需要输入颜色时,可直接选取颜色))

4、AutoFileName(自动完成文件名的输入,如图片选取,快捷输入文件名路径补全)

5、ChineseLocalzations (菜单汉化)

本人暂时安装了这些,有其他需要的可百度一下。

第四步:设置快捷键打开浏览器预览

点击菜单栏Preferences->Key Bindings

在这里面添加一下代码:

//chorme
{
"keys": ["f12"],
"command": "side_bar_files_open_with",
"args": {
"paths": [],
"application": "C:\\Users\\Administrator\\AppData\\Local\\Google\\Chrome\\Application\\chrome.exe",
"extensions": ".*"
}
}

特殊说明:

从谷歌浏览器属性这里的地址是需要加多一个\

"keys": ["f12"], 这个是快捷键的设置,保存就好啦!

Sublime Text3 搭建前端开发环境的更多相关文章

  1. Sublime Text3搭建PHP开发环境

    Sublime Text3搭建PHP开发环境 本文主要给大家分享了关于Sublime Text3搭建PHP开发环境 ,感兴趣的小伙伴可以做一下参考 一.Sublime text3安装 到官网http: ...

  2. Sublime Text3搭建完美开发环境(Python+PHP+Javascript+nodejs+C++)

    一.Sublime配置(如已安装Package Control可跳过) sublime下载地址:http://www.sublimetext.com/3 安装Package Control插件: 直接 ...

  3. 在mac上使用sublime text3搭建opencv3开发环境

    安装sublime text3 打开mac终端,安装brew 安装opencv3,终端输入下面的coomand: brew install opencv@3 注意:@3表示安装的版本,如果不加@3,那 ...

  4. 使用sublime text3搭建Python编辑环境

    最近在工作遇到一个难题. 我所在的测试组有一套PC软件前端自动化工程,在进行自动化测试时,需要在一台古老的xp机器上运行,但这台古老的xp机器带给我诸多烦恼,特别是使用Pycharm编辑器时,我遇到了 ...

  5. webpack 4.x之搭建前端开发环境

    webpack是一个现代JavaScript应用程序的静态模块打包器,借用官网的一张图,它能够将一些预处理语言,js的最新语法转换成浏览器识别的内容.现在一般的前端框架都有比较成熟的脚手架,大多数对w ...

  6. Windows环境下sublime text 3搭建前端开发环境

    一.安装SubLime Text 3 SubLime Text 3官网下载:https://www.sublimetext.com/ 二.安装Package Control 进入sublime后,按快 ...

  7. Sublime Text3 配置 NodeJs 开发环境

    题外话:使用visual studio开发NodeJs也是很方便,只需要安装插件即可. 本着对Sublime Text3的喜爱,尤其是最近更新后,界面和功能上感觉更nice了,那就配置一发环境吧! ( ...

  8. Python编译器及Sublime Text3安装及开发环境配置

    1.初学Python,你需要一个好的开发编辑器 在选择Python编辑器时,可能纠结于那个Python的版本更好一些,在Python2.x和Python3.x版本中, Python3.x版本更好一些, ...

  9. Windows Sublime text3 搭建Go语言环境

    第一步:Go环境和配置 1.安装 Go 开发环境(省略),假设Go安装目录为 C:\Go 2.配置环境变量,下面两个环境变脸没有就加上. 资料参考:http://studygolang.com/art ...

随机推荐

  1. UI系统综述:iOS的图形绘制、动画与runloop

    一.一条业务pipeline: 一个连接核心:coreanimation 二.两个进程: 1.app进程: 2.render进程: 首先,由 app 处理事件(Handle Events),如:用户的 ...

  2. Arduino通过串口监视器收发数据

    在串口监视器中发送数据,板子收到数据并打印出来. 不需要额外电路,但是板子必须连接电脑,Arduino IDE的串口监视器也需要被打开. 代码 /* 串口事件 当新的串口数据到来时,我们会将它添加到一 ...

  3. 在调试时,有什么更好的方法可以监视最后一个win32错误?

    我发现在代码中使用win32api时,需要多次监视最后一个win32错误!(在每次使用API后调用GetLastError()是不可行的解决方案!).. 在Visual Studio中,它们提供了一个 ...

  4. ACM数据结构-树状数组

    模板: int n; int tree[LEN]; int lowbit(int x){ return x&-x; } void update(int i,int d){//index,del ...

  5. MSSQL数据库 1000W数据优化整理

    GO SET STATISTICS TIME ON SELECT count([StyleId]) FROM [dbo].[Ky_Style] SET STATISTICS TIME OFF SET ...

  6. APP用户隐私协议

    告知用户 重视每个用户的的隐私,郑重承诺如下: 一.我们所收集的信息以及如何使用: 我们可能通过您的IP地址,地理位置信息,收集一些非个人隐私的统计资料,使我们能够进一步改善APP的服务.例如,当您浏 ...

  7. pyqt(day3)

    一.在pycharm中配置qtdesigner C:\Python\Python37\Lib\site-packages\pyqt5_tools\designer.exe 二.ui文件转换成pytho ...

  8. An overview of time series forecasting models

    An overview of time series forecasting models 2019-10-04 09:47:05 This blog is from: https://towards ...

  9. FNV哈希算法(转)

    由来:FNV哈希算法全名为Fowler-Noll-Vo算法,是以三位发明人Glenn Fowler,Landon Curt Noll,Phong Vo的名字来命名的,最早在1991年提出. 特点和用途 ...

  10. 微信小程序 input 的 type属性 text、number、idcard、digit 区别

    微信小程序的 input 有个属性叫 type,这个 type 有几个可选值: text:不必解释 number:数字键盘(无小数点) idcard:数字键盘(无小数点.有个 X 键) digit:数 ...