在前端开发中，我们经常需要进行代码格式化和代码风格检查，来保证代码的可读性和一致性。而 formatted-cli 就是一个能够帮助我们实现代码格式化和风格检查的 npm 包。
formatted-cli 支持多种代码格式化和风格检查工具，并且可以根据配置文件自定义工具的选项。在本教程中，我们将使用 formatted-cli 来学习如何进行代码格式化和风格检查。
安装 formatted-cli
首先，我们需要安装 formatted-cli 这个 npm 包。可以使用以下命令进行安装：
npm install -g formatted-cli
使用 formatted-cli 进行代码格式化
我们可以使用 formatted-cli 中内置的工具，或者使用一些开源的第三方工具来进行代码格式化。下面介绍如何使用 formatted-cli 来进行代码格式化。
Prettier
Prettier 是一个非常流行的代码格式化工具，可以自动格式化代码，并且可以根据配置文件来自定义格式化选项。我们可以使用 formatted-cli 来运行 Prettier。
首先，我们需要在项目根目录中创建一个 .prettierrc 文件，用来配置 Prettier 的选项。下面是一个示例配置文件：
{
"printWidth": 80,
"tabWidth": 2,
"singleQuote": true,
"trailingComma": "es5",
"semi": false
}然后，我们可以使用以下命令来格式化代码：
formatted-cli prettier --write src/**/*.js
这个命令会将 src 目录下所有的 js 文件格式化，并且将格式化后的代码写入原文件中。
ESLint
ESLint 是一个非常流行的 JavaScript 代码风格检查工具，可以帮助我们检查代码是否符合指定的 JavaScript 代码风格规范，并且可以根据配置文件来自定义规则和选项。我们可以使用 formatted-cli 来运行 ESLint。
首先，我们需要在项目根目录中创建一个 .eslintrc 文件，用来配置 ESLint 的规则和选项。下面是一个示例配置文件：
-- -------------------- ---- -------
-
---------- -
---------------------
-----------------------------
--
-------- -
------------- -----
-
-上面的配置文件中，我们使用了 eslint:recommended 和 plugin:prettier/recommended 这两个 preset 来设置 ESLint 的规则和选项，同时也禁用了 no-console 规则。
然后，我们可以使用以下命令来运行 ESLint：
formatted-cli eslint --fix src/**/*.js
这个命令会将 src 目录下所有的 js 文件进行风格检查，并且尝试自动修复一些错误。
配置 formatted-cli
我们可以在项目根目录中创建一个 formatted.config.js 文件来配置 formatted-cli 的选项。下面是一个示例配置文件：
module.exports = {
command: "prettier",
options: {
write: true,
src: ["src/**/*.js", "tests/**/*.js"],
},
};上面的配置文件中，我们指定了默认的 formatted-cli 命令为 prettier，并且设置了一些选项，比如 write 和 src。
我们可以在命令行中使用 formatted-cli 命令来运行 formatted-cli，也可以使用 npm scripts 来运行 formatted-cli，比如：
{
"scripts": {
"format": "formatted-cli"
}
}然后，我们可以使用以下命令来运行 formatted-cli：
npm run format
总结
在本教程中，我们介绍了如何使用 formatted-cli 进行代码格式化和风格检查，并且讲解了如何配置 formatted-cli 的选项。formatted-cli 可以帮助我们保证代码的可读性和一致性，提高开发效率和代码质量。希望本教程能够对您有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60056cf681e8991b448e6b79