乐闻
Prettier 与 ESLint 的区别是什么?如何协作使用?## Prettier 与 ESLint 的区别和协作
Prettier 和 ESLint 是前端开发中常用的两个工具,它们有不同的职责定位,但可以很好地协作使用。
### 主要区别
**Prettier(代码格式化工具)**
- 专注于代码格式化,统一代码风格
- 不进行代码质量检查
- 强制使用统一的代码风格,减少团队争议
- 通过解析 AST 重新生成代码
- 配置选项相对有限,避免过度配置
**ESLint(代码质量检查工具)**
- 专注于代码质量检查和潜在问题发现
- 检查代码错误、最佳实践、代码风格
- 提供大量的规则配置
- 可以自定义规则和插件
- 支持自动修复...
前端 · 2月21日 15:04
Nginx 的 location 指令如何匹配？优先级是什么？## Nginx 的 location 指令如何匹配？优先级是什么？
Nginx 的 location 指令用于匹配请求的 URI，并定义如何处理这些请求。理解 location 的匹配规则和优先级对于正确配置 Nginx 至关重要。
### Location 匹配规则：
#### 1. 精确匹配（=）
使用 `=` 进行精确匹配，如果匹配成功，立即停止搜索并使用该 location。
```nginx
location = /exact {
# 精确匹配 /exact
}
```
#### 2. 前缀匹配（无修饰符）
不使用任何修饰符，按前缀匹配，匹配成功后继续搜...
服务端 · 2月21日 12:14
Nginx 如何配置虚拟主机？有哪些配置方式？## Nginx 如何配置虚拟主机？有哪些配置方式？
Nginx 虚拟主机（Virtual Host）允许在同一台服务器上运行多个网站，通过不同的域名、端口或 IP 地址来区分不同的站点。
### 基于域名的虚拟主机：
```nginx
server {
listen 80;
server_name example.com www.example.com;
root /var/www/example.com;
index index.html index.php;
access_log /var/log/nginx/exa...
服务端 · 2月21日 12:24
Prettier 支持哪些配置文件格式?如何配置 Prettier?## Prettier 配置文件详解
Prettier 支持多种配置文件格式,开发者可以根据项目需求选择合适的配置方式。
### 配置文件类型
1. **`.prettierrc`** - JSON 格式配置文件
```json
{
"semi": true,
"singleQuote": true,
"tabWidth": 2,
"trailingComma": "es5"
}
```
2. **`.prettierrc.json`** - 显式 JSON 格式
```json
{
"prin...
前端 · 2月21日 15:04
Prettier 的缓存机制是如何工作的?如何使用缓存提高性能?## Prettier 的缓存机制详解
Prettier 2.0+ 版本引入了内置缓存机制,可以显著提高重复格式化的性能,特别是在大型项目中。
### 缓存机制原理
Prettier 的缓存基于文件内容和配置的哈希值:
1. **首次格式化**: 解析文件并格式化,将结果存储在缓存中
2. **后续格式化**: 比较文件内容和配置的哈希值
3. **缓存命中**: 如果哈希值相同,直接使用缓存结果
4. **缓存未命中**: 重新格式化文件并更新缓存
### 使用缓存
**基本用法**:
```bash
# 启用缓存格式化
prettier --write --cache "*...
前端 · 2月21日 15:16
如何管理 Prettier 的版本?有哪些升级策略?## Prettier 的版本管理和升级策略
Prettier 的版本管理对于保持团队代码风格一致性和利用新功能非常重要。合理的版本管理策略可以避免格式化冲突和团队协作问题。
### 版本锁定
**1. 在 package.json 中锁定版本**
```json
{
"devDependencies": {
"prettier": "^2.8.0"
}
}
```
**2. 使用精确版本号**
```json
{
"devDependencies": {
"prettier": "2.8.0"
}
}
```
**3. 使用 engines 字...
前端 · 2月21日 15:17
Prettier 支持哪些插件?如何开发自定义 Prettier 插件?## Prettier 的插件系统和扩展机制
Prettier 本身提供了丰富的语言支持,同时也支持通过插件系统扩展其功能,满足特定项目或语言的格式化需求。
### 插件类型
**1. 语言解析器插件**
为 Prettier 添加对新语言的支持,例如:
- `@prettier/plugin-php` - PHP 语言支持
- `@prettier/plugin-pug` - Pug 模板语言支持
- `@prettier/plugin-ruby` - Ruby 语言支持
- `@prettier/plugin-swift` - Swift 语言支持
**2. 格式化增强插件*...
前端 · 2月21日 15:06
如何优化 Prettier 的性能?有哪些最佳实践?## Prettier 的性能优化和最佳实践
在使用 Prettier 进行大型项目开发时,性能优化和最佳实践对于提高开发效率至关重要。
### 性能优化策略
**1. 使用 lint-staged 只格式化暂存文件**
```json
{
"lint-staged": {
"*.{js,jsx,ts,tsx,json,css,scss,md}": [
"prettier --write"
]
}
}
```
**2. 配置 .prettierignore 忽略不必要的文件**
```
node_modules
dist
build
cover...
前端 · 2月21日 15:05
Prettier 的 overrides 配置如何使用?有哪些常见场景?## Prettier 的 overrides 配置详解
Prettier 的 `overrides` 配置允许为不同的文件或目录设置不同的格式化规则,这对于多语言项目或需要特殊格式化的文件非常有用。
### 基本语法
```json
{
"semi": true,
"overrides": [
{
"files": "*.css",
"options": {
"singleQuote": false
}
}
]
}
```
### 文件匹配模式
**1. 单一文件扩展名**
```json
{
...
前端 · 2月21日 15:05
使用 Prettier 时常见的问题有哪些?如何解决?## Prettier 的常见问题和解决方案
在使用 Prettier 的过程中,开发者可能会遇到各种问题。了解这些常见问题及其解决方案可以帮助更高效地使用 Prettier。
### 配置相关问题
**1. 配置文件不生效**
**问题**: 修改了 `.prettierrc` 但格式化没有变化
**解决方案**:
- 确认配置文件位置正确(项目根目录)
- 检查配置文件语法是否正确(JSON 格式)
- 使用 `prettier --find-config-path <file>` 查看实际使用的配置
- 清除编辑器缓存
**2. 多个配置文件冲突**
**问题**: 项目中...
前端 · 2月21日 15:07