zoukankan      html  css  js  c++  java
  • Atom编辑器的插件

    先说下atom的插件安装方法吧,因为没用过苹果电脑,所以这里就只说下windows的操作吧。

    ctrl+, “调出设置面板

    点击install按钮,进去搜索插件面板

    1.expose

    在搜索框搜索expose,默认搜索的是packages,即插件,这里会有点慢,要等待一会儿,搜索完成后,点击install按钮,我这里是已经安装好的了,安装也要一会儿时间

    安装完成后,既可以使用该插件了,快捷键是  shift+alt+e ,点击快捷键后,出现下图

    出现该界面后,可以直接键盘,1-9,数字进行切换,也可以←(方向键向左)和→(方向键向右)进行切换,最后enter(回车)即可进入页面。

    2.color-picker

    可以直接跳出颜色面板,快捷键 ctrl+alt+c

    3.file-icons

    安装此插件后,左侧的菜单树中不同的文件会标示上不同的小图标,下面两图分别是安装之前和安装之后

         

    4.atom-beautify

    格式化代码插件,使用方法: ctrl+shift+p ,调出搜索框输入beautify,出现如下

    enter第一行后代码就自动格式化

    5.autoprefixer

    自动补全代码前缀,写完需要补全的代码,安装后的使用方法:

    1)在css或者scss文件中,直接ctrl+shift+p,调出搜索框,输入插件名

    如上图,使用插件后,代码自动补全

    2)在html文件中,需要选中style中的css代码,在进行上面1)的操作

    6.advanced-open-file

    新建文件或者打开某文件的插件,这是个很有用的插件呦,快捷键:ctrl+alt+o,

     

    若要新建文件,则选择对应的目录,输入名称后回车即可,若要打开某文件,则切换至改文件下,回车即可以进入该文件

    7.open-in-browers

    可以是html文件直接在浏览器中打开的插件,使用方法:在文件上右键出现操作面板

    选择想要的浏览器即可

    第二种方法,当安装完这个插件后,如果当前打开的是html文件,这文件的左下角的工具啦会出现下面图中的五种小图标,分别对应不同的浏览器,点击相应的即可

    8.autocomplete-paths

    自动补全路径,当遇到需要输入路径的时候,这个插件可以出现提示,如下

    9.Build Sass

    自动编译sass文件成css文件,使用方法如下

    10.emmet  ( !好用)

    这个插件应该都知道,sublime中同样好用的插件,自动补全代码,非常好用的插件,如下

     

    输入后点击tab键变成

    11.cssComb

    整理css的插件,使用方法:ctrl+shift+p调出搜索框,输入csscomb确定即可

    12.minimap

    安装这个插件后,会出现类似于sublime text的右侧小地图的东西

    悬浮还会出现操作按钮

    点击操作按钮后还出现一些选项,可以自己都试试

    13.Bookmarks

    这个插件应该是安装atom的时候自带的,不过挺好用的,中文就是字面意思:书签,快捷键如下

    Windows

    • alt-ctrl-f2   to add/remove a bookmark on the current line 增加或者移除当前行的书签
    • ctrl-shift-f2   to remove all bookmarks in the current editor 去掉当前编辑框的所有书签
    • ctrl-f2   to view all the bookmarks 查看所有书签
    • f2   to move the cursor to the next bookmark 跳转到当前光标的下一个书签处
    • shift-f2   to move the cursor to the previous bookmark. 跳转到当前光标的上一个书签处
    文章如有bug,请留言!
  • 相关阅读:
    xml
    反射
    类加载器
    TCP通信
    UDP通信
    网络通信
    【SpringBoot】Freemarkerの主キー
    【SpringBoot】Warの作成
    【Excel】ファイルの拡張子
    【SAP】TCODE表
  • 原文地址:https://www.cnblogs.com/olive27/p/5949792.html
Copyright © 2011-2022 走看看