news 2026/4/24 16:34:11

nodejs 下使用 Prettier 美化单个 JS 文件(完整教程)

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
nodejs 下使用 Prettier 美化单个 JS 文件(完整教程)

nodejs 下使用 Prettier 美化单个 JS 文件(完整教程)

一、使用场景说明

很多前端打包后的文件类似:

7165.89f0dbce.js

特点:

  • 文件名带 hash
  • 压缩 / 混淆
  • 不适合直接阅读

目标:

在不修改原文件的情况下,美化 JS,并生成一个可读的新文件pretty.js


二、环境准备(一次即可)

1️⃣ 安装 Node.js 和 npm

sudoaptupdatesudoaptinstallnodejsnpm-y

验证:

node -vnpm-v

能看到版本号即可。


三、安装 Prettier(全局)

正确方式:

sudonpminstall-g prettier

验证是否成功:

prettier -v

输出版本号说明安装完成。


四、美化单个 JS 文件(核心步骤)

原始文件

7165.89f0dbce.js

执行美化并生成新文件

prettier\--stdin-filepath7165.89f0dbce.js\7165.89f0dbce.js\>pretty.js

结果说明

文件说明
7165.89f0dbce.js原文件(完全不动)
pretty.js美化后的可读版本

✅ 推荐用于学习 / 代码分析 / 排错


五、为什么要用--stdin-filepath?(重点)

如果直接这样:

prettier7165.89f0dbce.js>pretty.js

可能会出现:

  • 格式规则不生效
  • 箭头函数 / 模块识别异常

正确原因

--stdin-filepath用来告诉 Prettier:

“这是一个JS 文件,请按 JS 规则解析”

✔️强烈推荐用于压缩 JS


六、提升可读性的常用参数(可选)

宽一点,少换行

prettier\--stdin-filepath7165.89f0dbce.js\--print-width120\7165.89f0dbce.js\>pretty.js

两个空格缩进

prettier\--stdin-filepath7165.89f0dbce.js\--tab-width2\7165.89f0dbce.js\>pretty.js

七、一键脚本(推荐)

新建脚本

nanobeautify-js.sh

内容

#!/bin/bashINPUT="7165.89f0dbce.js"OUTPUT="pretty.js"prettier\--stdin-filepath"$INPUT"\--print-width120\"$INPUT"\>"$OUTPUT"echo"✔ 已生成美化文件:$OUTPUT"

赋予执行权限

chmod+x beautify-js.sh

使用

./beautify-js.sh

八、如果 Prettier 美化效果不理想(备用)

针对极度混淆代码:

sudonpminstall-g js-beautify js-beautify7165.89f0dbce.js -o pretty.js

九、常见问题排查

❌ apt 安装失败

sudoaptinstallprettier

原因:

Prettier 是 Node 工具,不在 apt 仓库

✔️ 正解:npm install -g prettier


❌ 命令没反应

  • 确认prettier -v
  • 确认当前目录有 JS 文件

十、总结(推荐做法)

安全美化(不破坏原文件)

prettier --stdin-filepath7165.89f0dbce.js7165.89f0dbce.js>pretty.js

适合:

  • 打包文件分析
  • 源码学习
  • 线上问题排查
版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/4/22 0:32:47

PHP处理医疗数据导出的3大陷阱(90%开发者都踩过坑)

第一章:PHP处理医疗数据导出的核心挑战在医疗信息化系统中,使用PHP进行医疗数据导出面临诸多技术与合规性挑战。由于医疗数据高度敏感,必须确保导出过程中的完整性、隐私保护和格式一致性。数据隐私与安全合规 医疗数据受HIPAA、GDPR等法规严…

作者头像 李华
网站建设 2026/4/19 17:17:57

系留无人机系统

简 介: 本文讨论了系留无人机在雷区飞跃任务中的应用问题。提问者咨询了关于线缆使用的两个关键问题:线缆数量是否受限,以及线缆能否同时作为供电线和物理约束。通过建立包含绳索张力的整体数学模型,可以降低无人机定位定高的难度…

作者头像 李华
网站建设 2026/4/22 21:03:19

紧急应对医疗数据异常:PHP实时校验机制的4步快速部署方案

第一章:医疗数据异常的现状与挑战随着电子病历系统(EMR)、远程医疗和可穿戴设备的广泛应用,医疗数据正以前所未有的速度增长。然而,这些数据在采集、传输和存储过程中极易受到噪声、缺失值、录入错误甚至恶意篡改的影响…

作者头像 李华
网站建设 2026/4/23 12:46:32

MOOTDX 量化投资实战指南:从零掌握通达信数据接口

MOOTDX 量化投资实战指南:从零掌握通达信数据接口 【免费下载链接】mootdx 通达信数据读取的一个简便使用封装 项目地址: https://gitcode.com/GitHub_Trending/mo/mootdx MOOTDX 是一个功能强大的 Python 通达信数据接口封装,专为量化投资和金融…

作者头像 李华
网站建设 2026/4/23 10:35:15

【GraphQL与PHP接口文档实战指南】:手把手教你打造高效API文档体系

第一章:GraphQL与PHP接口文档概述GraphQL 是一种用于 API 的查询语言,由 Facebook 开发并开源,旨在解决传统 REST 接口在数据获取上的冗余与不足。与 REST 不同,GraphQL 允许客户端精确地请求所需字段,避免过度获取或多…

作者头像 李华
网站建设 2026/4/22 2:36:38

仅限专业人士查看:PHP驱动的农业传感器数据动态图表生成技术

第一章:农业传感器数据可视化的意义与挑战在现代农业中,传感器技术被广泛应用于监测土壤湿度、气温、光照强度、二氧化碳浓度等关键环境参数。这些数据的实时采集为精准农业提供了基础支持,而数据可视化则成为理解复杂信息流的核心手段。通过…

作者头像 李华