目录
提示:有时候安装会失败,那就换个思路:
1.Sync Settings
2.Emmet
3.Atom Beautify
选择你要配置的语言,我选择的是vue
4.Autocomplete Paths
5.Auto close HTML
6.Minimap
7.color-picker
8.vim-mode
9.git-plus
10.file-icons
11.docblockr
12.Linter Jshint
首页 开发工具 atom atom常用插件推荐(vue语法高亮)

atom常用插件推荐(vue语法高亮)

Jan 19, 2021 pm 06:55 PM

atom常用插件推荐(vue语法高亮)

相关推荐:atom(视频教程)

对于atom的使用,也是一次偶然,之前一直使用sublime,对于sublime的一些快捷使用也是比较熟悉了,换了一家公司,公司都在使用atom,入乡随俗吧,也改玩atom。

发现atom还是很不错,和sublime很像,很多package都很全,具体的一些介绍,大家可以自己慢慢看。

现在给大家说一些常用的插件:

(如果插件安装,并且配置也已经完毕,但没达到期望的效果,退出重新打开就可以了)

提示:有时候安装会失败,那就换个思路:

1.找到C:/Users/你的用户名/.atom/packages/文件夹内

2.在.atom packages 目录下 使用gitbash

3.git clone xxxxx/atom-beautify.git    (github上插件的地址)

3.cd .atom-beautify (进入下载好的插件的目录)

4.npm install

5.完成(别忘了重启atom)

在介绍插件之前,先说一下安装插件的位置:Packages > Settings View > Install Packages/Themes

1.Sync Settings

搭配github,同步你的atom插件信息,配置信息,让你轻松实现一台电脑配置,多台电脑共享。

2.Emmet

能够基于Emmet语法产生HTML,做过前段开发的不会不知道这个插件吧。好用到哭。

3.Atom Beautify

代码格式化工具,可以设置在保存时自动格式化,别提有多方便了。支持html,css,javascript,java,go等等,反正常见的语言基本都支持了。

配置:

选择你要配置的语言,我选择的是vue

4.Autocomplete Paths

自动补全文件路径,这个功能肯定使用嘛,完全避免了路径输入错误带来的bug。

5.Auto close HTML

自动输入对应的HTML关闭标签,虽然简答但是实用。

6.Minimap

这个插件不用介绍了吧,从sublime开始,一直使用。从未遗忘。

7.color-picker

取色器,让你在代码编写去直接打开取色板,拾取颜色。

8.vim-mode

vim死忠粉必备插件。

9.git-plus

让你轻松的在编辑器里管理你的git项目,各种常用git功能,信手拈来。

10.file-icons

很简单,为不同类型的文件添加一个漂亮的小图标,颜控开发者必备。

11.docblockr

文档化注释,你懂的,团队协作规范注释必备插件。

12.Linter Jshint

帮助你编写专业的js代码,js开发者必备插件。

推荐安装这些,其他的再按个人需求。

都装完了,react开发,代码高亮完全没问题,有图为证

但是vue呢,试一下喽,全灰,没有一丝杂色,泪流满面,想办法解决,

安装

安装完成,完美,再看代码,再次泪流,只有标签是高亮的,语法呢,还是灰的

这不是我想要的,我想要的是语法也要高亮。

继续,实现vue 语法高亮

1.选择

文件 》用户键盘映射 》keymap.cson文件(File 》 KeyMap... > keymap.cson)

2. 在文件末尾添加(注意: 如果配置文件中已经有'atom-text-editor[data-grammar~="vue"]:not([mini])':的其他配置, 那么要在其他配置的下面直接添加'tab': 'emmet:expand-abbreviation-with-tab', 而不能直接添加下面的两行, 不然会报错

'atom-text-editor[data-grammar~="vue"]:not([mini])':

    'tab': 'emmet:expand-abbreviation-with-tab'

如图:

重新退出atom,再启动,我们要的效果来了,和sublime基本一样

最后,英语不好的同学,想要汉化版,就用下图这个插件:

最后说句题外话,atom可以抛弃了,vsCode可以列为首选了。

更多编程相关知识,请访问:编程视频!!

以上是atom常用插件推荐(vue语法高亮)的详细内容。更多信息请关注PHP中文网其他相关文章!

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

AI Hentai Generator

AI Hentai Generator

免费生成ai无尽的。

热门文章

仓库:如何复兴队友
1 个月前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.能量晶体解释及其做什么(黄色晶体)
2 周前 By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒险:如何获得巨型种子
1 个月前 By 尊渡假赌尊渡假赌尊渡假赌

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

atom可以编译哪些语言 atom可以编译哪些语言 Mar 06, 2025 pm 12:35 PM

文本编辑器Atom不直接编译代码;它依赖外部编译器。 受支持的语言取决于可用的编译器和建立系统集成(通过软件包)。 原子的角色是代码编辑和执行外部编译

atom怎么使用 atom文本编辑器使用方法 atom怎么使用 atom文本编辑器使用方法 Mar 06, 2025 pm 12:25 PM

本指南提供了原子文本编辑器的全面介绍。 它涵盖了安装,用于增强功能的软件包管理,必需的键盘快捷键以及为各种编程语言配置原子,并强调其EX

atom如何运行程序 atom如何运行程序 Mar 06, 2025 pm 12:33 PM

本文解释了如何在Atom中运行程序,该程序是缺乏固有代码执行的文本编辑器。 它使用Atom的内置终端,构建系统和外部终端详细介绍方法,强调了特定语言软件包的重要性

atom怎么运行c代码 atom怎么运行c代码 Mar 06, 2025 pm 12:32 PM

文本编辑器Atom不直接运行C代码;它需要外部编译器(GCC,Clang)和构建系统(Make,Cmake)。 本文详细详细介绍了为C/C开发设置原子,包括安装必要的编译器,包装(例如Plat

atom编辑器和vscode哪个好用 atom编辑器和vscode哪个好用 Mar 06, 2025 pm 12:26 PM

本文比较了原子和VS代码,尽管Atom具有更大的可定制性,但强调了VS代码的出色性能,尤其是大型项目和众多扩展。 VS Code的用户友好性使其非常适合初学者

atom设置中文方法 atom文本编辑器怎么变成中文 atom设置中文方法 atom文本编辑器怎么变成中文 Mar 06, 2025 pm 12:23 PM

原子缺乏中国官方UI本地化。 虽然中文文本编辑完美无缺,但界面翻译依赖于不可靠的社区套餐。 建议专注于文件内容而不是接口翻译。

atom怎么安装插件 atom怎么安装插件 Mar 06, 2025 pm 12:34 PM

本文指导用户安装原子包,重点是查找特定语言的软件包并推荐提高生产力增强插件。 它强调了使用官方包装注册表避免安全风险的重要性

atom编辑器安装教程 atom编辑器安装教程 Mar 06, 2025 pm 12:30 PM

此教程详细信息在Windows上安装了可自定义的文本编辑器Atom。 它涵盖了安装步骤,系统要求(Windows 7,足够的RAM和磁盘空间),并阐明了包装安装后通过安装后通过

See all articles