atom 格式化前端代码 -- 自动缩进设置

最新推荐文章于 2025-11-03 17:06:26 发布
原创 最新推荐文章于 2025-11-03 17:06:26 发布 · 1.8w 阅读 · 8 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#atom #格式化代码 #atom缩进 #atom快捷键 #atom编辑器设置

本文介绍如何通过Atom编辑器的atom-beautify插件快速美化前端代码，并提供了两种快捷键配置方式，一种适用于默认tab缩进为4的情况，另一种适用于自定义tab缩进为2的情况。

1.下载atom-beautify插件

 

2.点击插件settings找到格式化快捷键代码，点击复制代码；

3.切换到快捷键绑定，点击用户键盘映射，在打开的文件最后粘贴复制的代码

4.将代码改成如下形式：

5.保存文件后，在前端代码人家执行快捷键ctrl+alt+shift+b, ctrl+a, ctrl+alt+b,就可以把代码格式的美美的。如果你是每次tab缩进2，那么直接使用ctrl+alt+shift+b就够了，如果你的tab默认值设置的是4，使用ctrl+alt+b。两个快捷键组合使用，应该能达到你的需求了。

第一次写博客文章，写的不好，有更好的方案，请留言指教。谢谢

前端代码格式化工具
Mr_Far的博客
03-11 3165
前端代码格式化工具 前言 在多人合作开发项目的过程中，由于每个程序员的编程习惯不同，经常会出现代码风格不一致的情况。 由此引发出了一个问题 ---- 代码提交时，会出现大量的格式修改。 于是，我们制定了统一的开发标准来规范代码风格。 但是，程序员需要花费大量时间去熟悉开发标准，才能开发出风格统一的代码。 于是，为了让程序员的开发工作更方便，我们使用了代码格式化工具，让它自动对代码进行格式化。 目前，比较流行的代码格式化工具有 ESLint 和 Prettier 。 接下来，我们就一起来了解一下它们的功能和使
前端代码格式化初探
Arui_0的博客
09-23 758
什么是代码风格 这个问题是最基础的，也是最重要的。只有理解了这个问题，下面的问题才有意义。代码风格可以类比于写作风格，只不过写作风格更加丰富多彩。例如美学家朱光潜的文字朴实直接，却很容易让人产生共情。两年前我第一次读他的《给青年的十二封信》，就引起了很多的思考。那种良师的谆谆教导的感觉，至今都让我难以忘记。类似英语环境中的作家海明威，就是行文硬朗，人送称号——美国硬汉。这就是一种写作风格。代码风格就更加具体了，好比句尾加不加分号，函数加不加空格，函数注释的格式。这些细碎的东西就构成了代码的风格。风格没有好坏
prettier-atom, 一个漂亮的格式化程序的Atom 包.zip
10-09
prettier-atom, 一个漂亮的格式化程序的Atom 包 Atom 更漂亮 ! 使用 Atom 包格式化 JavaScript 。 。CSS 。Sass和 JSON 。 可以选择与 ESLint 。EditorConfig插件和 stylelint集成。
代码整洁之道：掌握VSCode缩进控制，告别格式争议
最新发布
FuncTide的博客
11-03 928
轻松解决代码格式混乱问题，掌握VSCode缩进设置技巧。本文详解如何实现VSCode代码缩进空格转制表符，适用于多语言开发场景，提升协作效率与代码一致性。配置简单，一劳永逸，值得收藏。
Atom格式化C/C++代码（使用Atom-Beautify插件）
左云帆
12-04 2864
目录   1、在Atom中下载Atom-Beautify插件 2、安装uncrustify 3、在Atom中配置 4、使用 1、在Atom中下载Atom-Beautify插件 若由于网络原因一直下载插件失败，可以换一个国内的镜像软件源，比如淘宝源 win+r 输入cmd 调出终端 输入下面代码后回车，等待几秒看到有光标开始闪烁说明更改完成 apm config set regi...
前端代码格式化规范总结
weixin_34233856的博客
10-21 239
分号结尾一定要加 行长度最好不超过80个字符 换行： a)         运算符后换行，防止分析器自动分号加入机制误加分号 b)         长度达到单行最大限制换行时，运算符后换行并加入两个层级的缩进 c)         赋值时，如果需要换行，第二行之后对其到“=” 空行 方法之间 方法中的局部变量和第一条语句之间 在多行或多行注释之前 方法内的逻辑片...
Atom插件clang-format：在编辑器中格式化C++代码
Atom-atom-clang-format 是一个专为 Atom 编辑器设计的插件，其核心功能是将 clang-format 工具集成到 Atom 这一基于 Web 技术构建的开源文本编辑器中，从而实现对 C、C++ 等编程语言源代码的自动化格式化处理。...
Atom自动缩进检测包：智能设置制表符长度
该插件通过智能分析当前打开文件中的现有缩进风格（即制表符长度或空格数量），自动调整Atom编辑器中与缩进相关的设置，从而确保用户在编辑过程中无需手动切换缩进规则，避免因缩进不一致而导致的代码可读性下降或...
前端工程化之代码规范---ESLint + Prettier + husky + lint-staged代码规范全家桶
codingWeb的博客
11-07 1602
每个开发者都有自己的习惯，代码的风格也不尽相同，比如缩进的格数，结尾加不加分号,定义函数有没有空格，这些看似好像不起眼的风格，但在多人开发的时候，代码commit提交，可能就会出现一大片冲突，或者过多修改过的情况，对项目管理和维护是极其不友好的，而且在review，阅读项目代码的时候，一个项目中出现几种，甚至10几种的代码风格，我相信没人受得了这事，人都有一种惯性思维，习惯看一种风格，切换到其他风格可能需要适应一下，更别说人手一套风格的项目了，这肯定是不能接受的 ，这个问题很严重，必须得解决 ...
前端项目-js-beautify.zip
09-02
9. **与其他工具的整合**: js-beautify 可以与各种编辑器和IDE集成，如Visual Studio Code、Sublime Text、Atom等，通过插件实现快捷键操作，让代码格式化变得更加便捷。 10. **代码规范的重要性**: 使用js-...
Atom插件实现Shell脚本格式化功能
Atom 作为一个用 Web 技术构建的开源文本编辑器，其插件系统允许开发者使用 Node.js 和前端技术开发各种语言支持包、语法高亮、自动补全、代码检查和格式化工具。atom-format-shell 正是利用这一机制，在后台调用...
atom 格式化 工具 uncrustify
10-02
atom中 用于格式化 代码的工具，内包含有c++格式化文件。
前端工程——代码格式化
m0_72678953的博客
08-26 510
现在普遍项目都是团体开发，每个人都有自己不同的书写风格，我们需要格式化工具来统一码风。我们通用的方案是ESLint+Prettier，他们的职责如下：ESLint： 负责对代码的格式进行校验，配置文件为.eslintrc.jsPrettier：负责对代码进行格式化，配置文件为.prettierrc.js但是问题来了，这两种工具都有独立的配置项，我们需要人为编写配置去控制这两个工具保持一致。
前端项目中代码格式化配置：eslint + prettier + stylelint + pre-commit
MFWSCQ的博客
12-29 4796
lint
前端页面格式化代码
哈哈hyc的博客
08-23 2526
大家在写前端页面的时候经常也是用到各种格式化，要么就是手写，要么就是网上找一份，这里有一份比较齐全的格式化，大家可以参考使用 html,body,h1,h2,h3,h4,h5,h6,div,dl,dt,dd,ul,ol,li,p,blockquote,pre,hr,figure,table,caption,th,td,form,fieldset,legend,input,button,text...
前端CSS代码格式化、JavaScript代码格式化函数
KaiSarH
07-07 829
JS实现CSS代码格式化、JavaScript代码格式化
前端代码格式化设置--Prettier
江湖小葡萄
06-07 819
prettier,代码格式化
Prettier 前端代码格式化工具
weixin_41424721的博客
12-23 279
1、安装依赖 yarn add -D prettier eslint-config-prettier eslint-plugin-prettier @vue/eslint-config-prettier 2、文件配置 （1）配置.eslintrc module.exports = { root: true, parserOptions: { parser: 'babel-eslint' }, env: { browser: true, }, extends: [
前端代码格式化实战：js/css/html优化技巧
weixin_33363025的博客
05-10 1554
JavaScript代码格式化是确保代码质量和一致性的关键步骤。它不仅涉及到代码的可读性，还影响到团队协作和项目的长期维护。在众多格式化工具中，ESLint和Prettier是JavaScript开发中使用最为广泛的工具。它们各有优势，也有不同的使用场景和配置方法。无论选择哪种HTML格式化工具，正确地进行配置和自定义都是达到最佳格式化效果的关键。
评论 2
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值