在webstorm里面使用prettier

1. 安装 Prettier

bash


复制代码
npm install --save-dev prettier

2. 创建 Prettier 配置文件

在项目根目录下创建一个 .prettierrc 文件来定义 Prettier 的代码风格规则。以下是一个简单的 Prettier 配置文件示例：

json复制代码{
  "semi": false,                // 不加分号
  "singleQuote": true,          // 使用单引号
  "trailingComma": "es5",       // 在 ES5 语法支持的地方加逗号，如对象和数组
  "printWidth": 100,            // 一行代码最大字符数
  "tabWidth": 2,                // 使用 2 个空格进行缩进
  "useTabs": false              // 使用空格代替制表符
}

3. 使用 Prettier 格式化代码

你可以通过命令行来格式化项目中的代码文件。以下是一些常见的命令：

• 格式化整个项目中的所有文件：

bash

复制代码
npx prettier --write .

• 格式化指定的文件或文件夹：
  比如我要格式化: D:\ksec\YanAn\code\YAPMSWEBUI1.0\pds-vite
  这个目录下的 js文件和html文件

打开终端，进入项目根目录（如果你还没有进入项目目录，可以使用 cd 命令进入）：

bash
复制代码
cd D:\ksec\YanAn\code\YAPMSWEBUI1.0\pds-vite

运行 Prettier 格式化命令：

格式化整个项目（比如所有的 .js、.vue、.ts 文件）：

bash
复制代码
npx prettier --write .

格式化特定的文件（例如格式化所有 .js 文件）：

bash
复制代码
npx prettier --write "**/*.js"

4. 最大疑惑

如果没有用到node_modules但是你还是想用Prettier,那么你就要选择一个以前项目里node_modules有Prettier的目录

我使用过程中最大的一个问题就是 选择prettier在 node_modules里面的位置,不选就不会有效果

因为我选择的是图里的第二个自动配置

在你需要格式化的地方,然后文件里右键: