Atom主题插件美化教程

一、下载安装Atom

贴上官网:https://atom.io/

自己下载安装软件

二、安装插件

打开面板,可以看到如下:

对应的Themes就是可更换的主题。在这一共分为两块,UI Theme和Syntax Theme,一个是UI的,一个是文件语法的,这里可以选择相应的主题。

安装主题

可以通过Installed Themes安装主题,这里我使用的都是Material的主题,大家也可以尝试下。

在给大家推荐几个主题也不错,可以尝试下:

  • isotope-ui
  • seti-ui
  • monokai-flat

安装插件

安装插件Atom比Sublime做的稍微细致些,Atom有对插件的设置,以及插件介绍等。

插件安装直接选中Install,进行搜索即可,这里也是推荐一些我常用的插件,大家可以进行参考。

  • Emmet- 这个是书写HTML、CSS的神器,用过的都说好,相关语法文档可以看官网cheat-sheet,安装上面的语法也是经常写的就记住了。
  • autoprefixer - 用来补全CSS前缀的,会自动生成浏览器前缀
  • color-picker - 取色器,比Sublime那个好用,快
  • linter- 这个是检查各种语言的语法错误的,可以使用linter这个,也可以针对某些语言使用特定的lineter +     linter-jshint, <span class="hljs-keyword">for</span> JavaScript <span class="hljs-keyword">and</span> JSON, <span class="hljs-keyword">using</span> jshint +    linter-coffeelint, <span class="hljs-keyword">for</span> CoffeeScript, <span class="hljs-keyword">using</span> coffeelint +     linter-tslint, <span class="hljs-keyword">for</span> Typescript, <span class="hljs-keyword">using</span> tslint +     linter-php, <span class="hljs-keyword">for</span> PHP <span class="hljs-keyword">using</span> php -l +    linter-pylint, <span class="hljs-keyword">for</span> Python, <span class="hljs-keyword">using</span> pylint +     linter-scss-lint, <span class="hljs-keyword">for</span> SASS/SCSS, <span class="hljs-keyword">using</span> scss-lint +     linter-less, <span class="hljs-keyword">for</span> LESS, <span class="hljs-keyword">using</span> less +     linter-csslint, <span class="hljs-keyword">for</span> CSS, <span class="hljs-keyword">using</span> csslint +     linter-stylint, <span class="hljs-keyword">for</span> Stylus, <span class="hljs-keyword">using</span> stylint +     linter-stylus, <span class="hljs-keyword">for</span> Stylus, <span class="hljs-keyword">using</span> stylus  
  • autocomplete-plus 自动补全功能,可以设置一些语言的自动提示补全,挺好的
  • atom-ternjs js 代码提示,可以提示browser、es5、es6、jquery都可以
  • atom-beautify 格式化代码
  • atom-minify css/js压缩神器,执行压缩快捷键
    • ctrl-shift-m:执行压缩,生成一个带min后缀的(如果不想使用min可以进行设置修改)
    • ctrl-alt-shift-m / ctrl-cmd-shift-m:全局开启或者关闭保存自动生成压缩软件
    • ctrl-alt-shift-h / ctrl-cmd-shift-h:全局开启或者关闭执行后弹出的消息面板
  • less-autocompile 实时编辑的工具
  • atom-css-comb 对于css代码进来排版的
  • docblockr 注释插件
  • file-icons 文件图标,侧边栏前面的icon
  • git-plus git协作工具
  • minimap 编辑器内部的代码缩略视图
  • active-power-mode 装逼插件,代码酷炫的效果
  • power-mode 也是装逼插件,大家自行去试验

其它插件大家可以自行google,还有很多好玩的插件等待大家来发掘~~

三、安装源被墙的解决措施

由于源在国外,所以可能会被墙,提示网络问题,或者干脆下不下来。这时候,我们可以通过github下载手动安装插件或主题。

进入插件安装官网:https://atom.io/packages

搜索想下载的插件,点进去,再点击"Version",进入github

此时再点击“source code”,下载源代码

将源码解压至Atom插件目录:C:\Users\username\.atom\packages

此时再进入Atom,提示错误。此时再进入相应的目录手动安装,注意需要安装Node.js环境。代码如下

cd C:\Users\username\.atom\packages\......
npm install module_name

四、其他解决方法

1.首先在电脑上安装nodejs,和git工具。atom的安装目录(windows)是 C:\Users\Administrator.atom\packages (mac 下:cd ~/.atom/packages)所以最好用命令工具进这个目录再安装。 2.在https://atom.io/packages 找到自己要安装的插件,进入插件详情页面,repo里会有github地址,比如我安装color-picker 3.在命令行里,git clone https://github.com/thomaslindstrom/color-picker.git83  4.cd color-picker 5.npm install 6.重启atom

除特别注明外,本站所有文章均为慕白博客原创,转载请注明出处来自https://geekmubai.com/programming/270.html

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏進无尽的文章

基础篇-修改工程名称及中工程中的某一类名

入行这么久,自己也记录了很多的开发笔记,却一直堆在小角落里,没有系统的梳理,也难成体系,最近在整理很久之前的笔记,虽然对于熟手来说不值得一看,但是还是打算写成文...

12810
来自专栏从零开始学自动化测试

Appium+python自动化16-启动ios上Safari浏览器

前言 在mac上搭建appium踩了不少坑,先是版本低了,启动后无限重启模拟器。后来全部升级最新版本,就稳稳的了。本篇介绍如何用appium启动ios上的saf...

60040
来自专栏建站达人秀

如何搭建 Express 网站

Express 是一种保持最低程度规模的灵活 Node.js Web 应用程序框架,为 Web 和移动应用程序提供一组强大的功能。nenggou 使用您提议的各...

52220
来自专栏崔庆才的专栏

只会用Selenium爬网页?Appium爬App了解一下

4.1K60
来自专栏前端儿

iPhone页面的常用调试方法

某些页面需要设置HOST才能进行访问,在iPhone上不好设置HOST,所以需要一些代理工具帮助我们

56710
来自专栏LinXunFeng的专栏

Xcode8 最快最方便的安装插件方案

11250
来自专栏数据库

C#如何使用SQLite数据库兼容32位,64位系统

C#如何使用SQLite数据库兼容32位,64位系统 新建一个项目 使用VS2013新建一个WinForm应用程序,建立一个如下图所示的窗口,在窗口上面添加几个...

35060
来自专栏云计算教程系列

如何在Ubuntu 14.04上使用Fail2Ban保护WordPress

WordPress是一个非常强大的内容管理系统(CMS),是免费和开源的。因为任何人都可以发表评论,创建一个帐户,并在WordPress上发帖,许多恶意行为者已...

19100
来自专栏小尘哥的专栏

前后端分离Nuxt.js解决SEO问题

背景:由于后端程序猿通常对CSS 、JS掌握不是特别好,通常的开发模式,UI把静态html做好交给程序猿,程序猿开发,把静态html变成动态的时候经常会有各种样...

54640
来自专栏张戈的专栏

借助PageSpeed,为Nginx网站服务器提速

网站加载速度越快,访客互动性、留住率和转换率就越高,这早已不是什么秘密。网站每延迟 100 毫秒,亚马逊的销售额就会减少 1%;延迟增加 500 毫秒,这意味着...

41870

扫码关注云+社区

领取腾讯云代金券