@blgc/config 是 Builder Group 用于 TypeScript 项目的共享配置包。 它在一个版本的依赖性中保持了格式化,linting,类型检查,和节点测试默认,因此包可以共享严格的工具行为而无需复制配置文件.

• 格式代码, Markdown, 导入, Tailwind 类, 以及包含一个 Pretier 配置的软件包
• 为库、React、Next.js和TanStack项目选择平面的 ESLint 预设
• 扩展捆绑库、 DOM 库、 节点 20、 React、 Next.js 和 TanStack 的 TypeScript 预设
• 重新使用带有 TypeScript 路径分辨率和覆盖记录员的 Vitest 节点预设

// eslint.config.js
module.exports = [...require('@blgc/config/eslint/library')];

// tsconfig.json
{
  "extends": "@blgc/config/typescript/library",
  "include": ["src"]
}

{
  "prettier": "@blgc/config/prettier"
}

从 0.0.x看到了吗 移民.md。 。 。 .

安装

安装配置包 :

npm install -D @blgc/config

安装您项目使用的入口工具包 :

# ESLint presets
npm install -D eslint typescript

# Prettier config
npm install -D prettier

# TypeScript configs
npm install -D typescript

# Vitest config
npm install -D vitest

共享插件依赖性解析自 @blgc/config,因此项目只需要安装它们直接运行的工具包.

使用量

使用匹配工具或项目类型的切入点 :

高级

引用共享配置来自 package.json数字 :

{
  "prettier": "@blgc/config/prettier"
}

该配置包括:

• LF行结尾,代码文件标签,两相距马克下缩进,单引号,分号,以及 printWidth: 100
• 导入排序通过 @ianvs/prettier-plugin-sort-imports
• 软件包.json 订购通过 prettier-plugin-packagejson
• 尾风类排序通过 prettier-plugin-tailwindcss

Pretier 插件从 @blgc/config,因此消耗性软件包不需要直接安装这些插件.

需要 Tailwind v4 样式表路径或 Tailwind v3 配置路径的项目可以在本地扩展配置 :

module.exports = {
  ...require('@blgc/config/prettier'),
  tailwindStylesheet: './src/styles.css'
};

ESLint 语录

使用平面配置从 eslint.config.js数字 :

// CommonJS
module.exports = [
  ...require('@blgc/config/eslint/library'),
  {
    rules: {
      // local overrides
    }
  }
];

// ESM
import libraryConfig from '@blgc/config/eslint/library';

export default [
  ...libraryConfig,
  {
    rules: {
      // local overrides
    }
  }
];

按项目类型选择预设 :

基础预设用途 @eslint/js 建议的规则, typescript-eslint 严格规则, Turbo env-var 警告, 生成/ 构建文物忽略, 配置文件的节点全局, 以及 Pretier 兼容性 。 共享规则结果报告为警告 eslint-plugin-only-warn; 使用 eslint --max-warnings=0 当项目准备执行干净结果时,在CI中.

类型脚本

扩展最近的类型脚本配置 :

{
  "extends": "@blgc/config/typescript/library",
  "compilerOptions": {
    "outDir": "./dist",
    "rootDir": "./src",
    "declarationDir": "./dist/types"
  },
  "include": ["src"]
}

可用的配置 :

默认知道:基础配置使用ES2022, module: preserve,捆绑模块分辨率,强制模块检测,声明输出,声明地图, skipLibCheck,并严格类型检查。 TypeScript未使用的检查停止,因为ESLint拥有未使用的诊断.

使用 @blgc/config/typescript/library 当一个包通过捆绑器释放出JavaScript时,并使用TypeScript来发布声明. 使用 @blgc/config/typescript/node20 用于发送 JavaScript 的节点软件包或工具 tsc。 。 。 .

维特

想要默认测试设置时合并共享的 Vitest 节点配置 :

import { nodeConfig } from '@blgc/config/vitest/node';
import { defineConfig, mergeConfig } from 'vitest/config';

export default mergeConfig(
  nodeConfig,
  defineConfig({
    test: {
      // project-specific test options
    }
  })
);

节点配置设置了节点测试环境,实现了TypeScript路径解析,并使用文本,JSON,和HTML覆盖记录员.

财务问题

我需要安装每个对等工具吗?

没有。 安装您运行的工具 。 例如,只扩展TypeScript配置的软件包不需要安装ESLint,Prettier,或Vitest.

我能超越规则吗?

对 在共享配置后添加另一个配置对象 eslint.config.js,添加 compilerOptions 内 tsconfig.json,或将特定项目选项传递给 mergeConfig 为了维特.

为什么ESLint报告警告而不是失败?

共享的 ESLint 配置首先是一个准则. 规则的发现报告为警告,这样人类和特工们就可以在不阻碍当地工作的情况下看到什么改进.

使用 eslint --max-warnings=0 在 CI 或软件包脚本中,当项目准备执行干净的插件结果时.

为什么共享配置文件是共同JS?

CommonJS保留了从CommonJS和无害环境管理项目配置中可以使用的配置包. 无害环境管理项目可以导入普通JS预设,但普通JS项目不能同步 require() 无害环境管理预设.

为什么"反应ESLint"配置使用"jiti"??

@eslint-react/eslint-plugin 仅限无害环境管理. jiti 让 CommunityJS ESLint 预设加载插件而不强制每个消费者迁移其 eslint.config.js 对无害环境管理的考虑.

为什么库 TypeScript 配置使用模块保存?

大多数"构建者"组包让"Rollup"或"esbuilt"放出JavaScript并让"TypeScript"放出声明. module: preserve 让 TypeScript 的导入分辨率更接近这些捆绑者所看到的. 以 JavaScript 发布节点包 tsc 应当使用节点预设或覆盖 compilerOptions.module。 。 。 .

为什么不启用每个严格的 TypeScript 旗?

像旗帜 exactOptionalPropertyTypes, (中文(简体) ), verbatimModuleSyntax,以及 erasableSyntaxOnly 它们是有用的迁移目标,但它们要求进行源一级清理,或不允许当前源模式。 一旦一个项目为更严格的合同做好准备,就在当地启用.

为什么把这些配置放在包里?

一个软件包保持默认版本,可审查,可再使用. 项目可以更新一个依赖,而不是手工复制配置变化.

贷项

• turbo-basic: Vercel启动模板中的基础配置模式
• tsconfig/bases: 类型脚本配置参考