灏天阁

vue3.2/Vite/Ts3: 配置 prettier

· Yin灏

eslint 针对的是 javascript，他是一个检测工具，包含 js 语法以及少部分格式问题，在 eslint 看来，语法对了就能保证代码正常运行，格式问题属于其次；而 prettier 属于格式化工具，他能把 eslint 没干完的事情接着干，另外，prettier 支持包含 js 在内的多种语言。

总结起来：eslint 和 prettier 这两个一个保证 js 代码质量，一个保证代码美观。

安装依赖包：

pnpm install -D eslint-plugin-prettier prettier eslint-config-prettier

.prettier.json 添加规则：

{
    "singleQuote": true,
    "semi": false,
    "bracketSpacing": true,
    "htmlWhitespaceSensitivity": "ignore",
    "endOfLine": "auto",
    "trailingComma": "all",
    "tabWidth": 2
}

.prettierignore 忽略文件

/dist/*
/html/*
.local
/node_modules/*
**/*.svg
**/*.sh
/public/*

通过 pnpm run lint 去检查语法，如果出现不规范格式，通过 pnpm run fix 修改。

- Book Lists -