Zoldytech JavaScript

https://github.com/zoldytech/javascript
Admin
Zoldytech JavaScript provides SonarQube-compatible ESLint presets, shared Prettier configs, and...
Tokens:2,284
Snippets:27
Trust Score:6
License:MIT
Update:1 month ago
Show doc for...
Tokens:
Raw
### Install Zoldytech JavaScript package

Source: https://github.com/zoldytech/javascript/blob/main/README.md

Install the package as a development dependency.

```bash
npm i -D @zoldytech/javascript
```

--------------------------------

### Development Commands

Source: https://github.com/zoldytech/javascript/blob/main/README.md

Standard npm scripts for installing dependencies, linting the codebase, and running end-to-end tests.

```bash
npm install     # clean install, no flags
npm run lint    # dogfoods the base preset on this repo
npm test        # E2E: each preset lints its fixture app (node --test)
```

--------------------------------

### Configure Git hooks with Husky and lint-staged

Source: https://github.com/zoldytech/javascript/blob/main/README.md

Setup lint-staged in package.json and the corresponding pre-commit hook file.

```jsonc
// package.json
{
  "scripts": { "prepare": "husky" },
  "lint-staged": {
    "*.{ts,tsx,js,jsx,mjs,cjs}": ["eslint --fix --max-warnings=0", "prettier --write"],
    "*.{css,json,md,yml,yaml}": ["prettier --write"],
  },
}
```

```sh
# .husky/pre-commit
npx lint-staged
```

--------------------------------

### TypeScript noUncheckedIndexedAccess behavior

Source: https://github.com/zoldytech/javascript/blob/main/README.md

Example demonstrating how the noUncheckedIndexedAccess flag forces handling of potentially undefined values.

```ts
const [row] = await db.insert(project).values(input).returning({ id: project.id });
return row.id; // `row` is `T | undefined` at runtime; without the flag TS says it is always `T`
```

--------------------------------

### Configure Prettier in package.json

Source: https://github.com/zoldytech/javascript/blob/main/README.md

Point Prettier to the shared configuration package.

```json
{ "prettier": "@zoldytech/javascript/prettier" }
```

--------------------------------

### Configure ESLint presets

Source: https://github.com/zoldytech/javascript/blob/main/README.md

Import and export the desired preset in your eslint.config.mjs file.

```js
// eslint.config.mjs — Next.js
import { next } from '@zoldytech/javascript/eslint';

export default next({
  typeChecked: true,
  ignores: ['.next/**', 'coverage/**'],
});
```

```js
// NestJS (typeChecked defaults to true)
import { nest } from '@zoldytech/javascript/eslint';
export default nest({ tsconfigPath: 'tsconfig.json' });
```

```js
// React + Vite
import { react } from '@zoldytech/javascript/eslint';
export default react();
```

```js
// React Native
import { reactNative } from '@zoldytech/javascript/eslint';
export default reactNative();
```

```js
// plain JS/TS
import { base } from '@zoldytech/javascript/eslint';
export default base();
```

--------------------------------

### ESLint Preset Functions

Source: https://github.com/zoldytech/javascript/blob/main/README.md

Functions used to initialize ESLint configurations for different project types. Each function returns a FlatConfigComposer and accepts optional configuration parameters.

```APIDOC
## ESLint Preset Functions

### Description
Initializes an ESLint configuration for specific project types. These functions are intended to be the default export in `eslint.config.mjs`.

### Available Functions
- `next(options)`: Preset for Next.js projects.
- `nest(options)`: Preset for NestJS projects.
- `react(options)`: Preset for React + Vite projects.
- `reactNative(options)`: Preset for React Native projects.
- `base(options)`: Preset for plain JS/TS projects.

### Options
- **typeChecked** (boolean) - Optional - Enable antfu type-aware linting. Defaults to `false` (except `nest` which defaults to `true`).
- **tsconfigPath** (string) - Optional - Path to tsconfig for type-aware linting. Defaults to `'tsconfig.json'`.
- **tsdoc** (boolean) - Optional - Enable the `tsdoc/syntax` gate on TS files. Defaults to `false`.
- **ignores** (string[]) - Optional - Project ignore globs.
- **testGlobs** (string[]) - Optional - Override where a subset of sonarjs rules is relaxed.
- **overrides** (object[]) - Optional - Extra flat-config blocks.
- **antfuOptions** (object) - Optional - Extra options merged into the underlying `antfu()` call.
```

--------------------------------

### Extend TypeScript configuration

Source: https://github.com/zoldytech/javascript/blob/main/README.md

Extend the base TypeScript configuration in tsconfig.json to include project-specific paths and source directories.

```json
{
  "extends": "@zoldytech/javascript/tsconfig/next.json",
  "compilerOptions": { "paths": { "@/*": ["./src/*"] } },
  "include": ["src"]
}
```

--------------------------------

### Configure TypeScript for React Native Web

Source: https://github.com/zoldytech/javascript/blob/main/docs/react-native.md

Use this configuration to enable web-augmented type definitions when using react-native-web in a project.

```json
{
  "extends": "@zoldytech/javascript/tsconfig/react-native.json",
  "compilerOptions": { "types": ["react-native-web"] },
  "include": ["src"]
}
```

--------------------------------

### Define React Native ESLint Layer

Source: https://github.com/zoldytech/javascript/blob/main/docs/react-native.md

Configuration object for integrating react-native plugin rules and globals into the ESLint flat config structure.

```js
import reactNativePlugin from 'eslint-plugin-react-native';

// Replace reactNativeGlobals() with a full layer block that also registers
// the plugin (mirror nextCoreWebVitals()):
const reactNativeLayer = {
  name: 'zoldytech/react-native',
  files: ['**/*.{js,jsx,ts,tsx}'],
  plugins: { 'react-native': reactNativePlugin },
  // the plugin exposes the RN env globals directly:
  languageOptions: {
    globals: { ...reactNativePlugin.environments['react-native'].globals },
  },
  rules: {
    'react-native/no-unused-styles': 'error',
    'react-native/no-single-element-style-arrays': 'error',
    'react-native/split-platform-components': 'error',
    'react-native/no-inline-styles': 'error',
    'react-native/no-color-literals': 'error',
    'react-native/no-raw-text': 'error', // noisiest — relax via `overrides` if needed
  },
};
```
Tokens:
Raw