没有天生的高手,更没有永远的菜鸟求知若饥, 虚心若愚

前端开发利器Deepin+Atom


这里说起前端开发工具,主要是将更方便的开发方式分享给大家!
因为工作需要及前辈的影响,让我接触到了Deepin Linux操作系统,搭载Atom开发工具,这对前端来说也是一个很大的挑战,面临这一个新的操作系统及摸不透的命令行。因为工作需要及前辈的影响,让我接触到了Deepin Linux操作系统,搭载Atom开发工具,这对前端来说也是一个很大的挑战,面临这一个新的操作系统及摸不透的命令行。

在师父(FungLeo)的带领下进入了Linux世界,从此在开发的征程中得到了很大的提升。

首先我们来说说Deepin操作系统

deepin操作系统安装是非常方便的,具体安装方式请移步deepin官方文档https://www.deepin.org/installation/
733925423.png
整个界面还是十分美观的,结合了Windows和Mac OS的一些优点,默认Chrome浏览器,对于前端开发足以,除此之外,deepin系统自带应用商店,安装软件简单,也可以使用Linux命令安装。
907040117.png

ATOM

Atom 一个21世纪的一个黑客文本编辑器(是不是这样只有自己试过才知道)
官方地址:https://atom.io/

deepin系统安装

847419714.png

可以直接在应用商店搜索安装,这种方式比较普遍,也很简单

Linux命令行安装

sudo add-apt-repository ppa:webupd8team/atom
sudo apt-get update
sudo apt-get install atom

Atom 配置

Atom 禁用「自动去掉行尾空格」

File -> Preferences -> type "whitespace" -> disable [Remove Trailing Whitespace].

去掉的原因是,有些开源的库是并没有符合codestyle,但是那些也不是自己要改的,如果自行更改了会造成不少的麻烦。

比如以后合并时会相当麻烦。如果是一个自行开发的项目可以这样重新打开这个开关。

Atom修改Tab长度

File -> Preferences -> Settings -> Tab Length

(注:修改后原来的并不会跟着改变,需要手动改变一下,毕竟是用空格代替的Tab)

Atom 查件安装

官网下载安装atom软件,官网传送门链接 https://atom.io/

自动安装插件

进入目录file -> setting

2802762009.png

手动安装

必要条件:安装git,node

cd ~/.atom/packages/
git clone <插件的git地址> # 比如:git clone https://github.com/Glavin001/atom-beautify.git
cd <包名> # cd atom-beautify
npm install

推荐几款常用包

(1)atom-ternjs : js(e6)的自动补充

(2)key-binding-mode : atom 快捷键管理

(3)pre-view : pdf预览

(4)activate-power-mode : 相信很多人开始用atom是因为看了关于这个超级炫酷的动画来的,它让你敲代码的时候产生炫酷效果,== 然而对于程序媛来说病并没有用 只适合娱乐和在外行前装bi

(5)color-picker : 可像chorme里面一样,直接吸取颜色的色值,写css的时候不错

(6)language-todotxt : 一般po主用来看小说(开始的时候用sublime,小说可以直接拖进去,但是用了atom以后,txt不被识别,所以才去找了插件)

(7)pigments : 它和(5)可能是姐妹吧,在atom里面所有颜色的色值,它会自动加上背景色,所以是颜色的地方一看就知道是什么sai

(8)atom-beautify : 支持html,css,js,php...等的格式美化

(9)emmet : 这个对于写html来说的必不可少,链上一个语法传送门 http://docs.emmet.io/cheat-sheet/

(10)markdown-format : 支持.md文件在atom里的预览

(11)file-type-icons : 对于写代码来说其实用处也不大,就是在atom的目录里面给不同文件添上特色图标,不过细节决定品质

(12)mini-map : 代码的小地图,和sublime没什么区别

文章评论已关闭!