TS项目初始化(Vitest+Eslint+Prettier)
本文首发于:TS项目初始化(Vitest+Eslint+Prettier) -Aiysosis Blog(aiysosis.ink),未经允许请勿转载。
前言
本文主要用于TS项目的快速初始化,使用yarn作为包管理器,使用Vitest代替Jest,因为Vitest提供了对TS的原生支持,不需要配置babel,且语法与Jest保持一致,具有比较小的迁移成本。Eslint+Prettier结合Vscode的自动格式化,让代码更加美观。
初始化
创建项目文件,首先初始化npm环境。
yarn init
#or
yarn init -y
-y
默认初始化时所以的提问都回答yes。初始化成功,package.json文件被创建。
安装依赖
依赖列表(全部安装为开发依赖即可)。
@typescript-eslint/eslint-plugin
@typescript-eslint/parser
eslint
eslint-config-prettier
eslint-plugin-prettier
prettier
typescript
vitest
使用yarn安装依赖。
yarn add --dev @typescript-eslint/eslint-plugin @typescript-eslint/parser eslint eslint-config-prettier eslint-plugin-prettier prettier typescript vitest
配置typescript
创建tsconfig.json文件,或者执行:
npx tsc --init
最终配置:
//tsconfig.json
{
"compilerOptions": {
"target": "es2016",
"module": "commonjs",
"rootDir": "./",
"baseUrl": "./",
"paths": {
"@/*":["./src/*"]//路径别名 @->src
},
"types": ["vitest/globals"],//vitest 类型引入
"allowJs": true,
"sourceMap": true,//便于 debug
"esModuleInterop": true,