# @lottiefiles/tsconfig

> Shared Typescript config for LottieFiles projects

Latest version **2.0.0** (published 2023-05-30) · MIT license · 0 weekly downloads

## Install

```sh
npm install @lottiefiles/tsconfig
pnpm add @lottiefiles/tsconfig
yarn add @lottiefiles/tsconfig
bun add @lottiefiles/tsconfig
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 2.0.0 |
| Published | 2023-05-30 |
| First published | 2023-05-30 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Node | >= 14 |
| Dependencies | 0 |
| Unpacked size | 7.9 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | LottieFiles |
| Maintainers | aidosmf, jawish, karamalie, sam-osb |
| Keywords | config, tsconfig, typescript |

## Links

- npm: https://www.npmjs.com/package/@lottiefiles/tsconfig
- Repository: https://github.com/LottieFiles/webdev
- Homepage: https://github.com/LottieFiles/webdev#readme
- Issues: https://github.com/LottieFiles/webdev/issues
- npm.io page: https://npm.io/package/@lottiefiles/tsconfig

## Alternatives

- [jsforce](https://npm.io/package/jsforce.md) — 851.2K weekly downloads
- [react-native-qrcode-svg](https://npm.io/package/react-native-qrcode-svg.md) — 693.5K weekly downloads
- [@salesforce/plugin-data](https://npm.io/package/@salesforce/plugin-data.md) — 394.9K weekly downloads
- [@backstage/plugin-search-common](https://npm.io/package/@backstage/plugin-search-common.md) — 308.5K weekly downloads
- [@chain-registry/types](https://npm.io/package/@chain-registry/types.md) — 38.4K weekly downloads

## Recent versions

- 2.0.0 (latest) — 2023-05-30

## README

# Typescript Config

> Base `tsconfig.json` for using Typescript in the various projects at LottieFiles.

## Table of contents

* [Installation](#installation)
* [Usage](#usage)
* [Changelog](#changelog)

## Installation

#### 1. Install config and Typescript.

Install Typescript and the shared config by running:

```sh
# Normal repository? Install in the project root.
pnpm add -D typescript @lottiefiles/tsconfig

# Monorepo? Install Prettier in the project root workspace.
pnpm add -DW typescript @lottiefiles/tsconfig
```

#### 2. Create configuration file

Create a `tsconfig.json` file in your project root with the contents below:

```json
{
  "extends": "@lottiefiles/tsconfig",

  "compilerOptions": {
    // Compiled output JS and source maps output directory
    "outDir": "./dist",

    // Source root directory
    "rootDir": "./src",
  }
}
```

## Usage

#### Monorepo Recommendation

##### tsconfig.build.json

Create a `tsconfig.build.json` in the project root that extends from `@lottiefiles/tsconfig`. This file will be used for
build processes.

```json
{
  // Extend from the org config
  "extends": "@lottiefiles/tsconfig",

  "compilerOptions": {
    // Use composite mode to enable building using projects and project references
    "composite": true,

    // Allow emit (required for composite mode)
    "noEmit": false
  },

  "exclude": [
    // Exclude tests and snapshots
    "**/test",
    "**/*.test.ts",
    "**/__mocks__",
    "**/__tests__",
    "**/__snapshots__",
    "**/coverage",

    // Exclude builds
    "**/dist",
    "**/dist-dev",
    "**/artifacts"
  ]
}
```

##### tsconfig.dev.json

Create a `tsconfig.dev.json` in the project root that extends from `@lottiefiles/tsconfig`. This file will be used for
linting processes.

```json
{
  // Extend from the org config
  "extends": "@lottiefiles/tsconfig",

  "compilerOptions": {
    // Allow non-module Typescript files (e.g. scripts)
    "isolatedModules": false
  },

  "exclude": [
    // Exclude non-code test resources
    "**/__snapshots__",
    "**/coverage",

    // Exclude builds
    "**/dist",
    "**/dist-dev",
    "**/artifacts"
  ],

  // Include all Javascript, Typescript, JSX, CommonJS and Module files
  "include": ["**/*.js", "**/*.jsx", "**/*.json", "**/*.ts", "**/*.tsx", "**/*.mjs", "**/*.cjs", "**/.*.cjs"]
}
```

##### tsconfig.json

Create a `tsconfig.json` in the root that extends from the `tsconfig.build.json` file and add any development/IDE
relevant customization necessary for Typescript typechecking.

```json
{
  // Must be set to empty [] array
  "files": [],

  "compilerOptions": {
    "disableSourceOfProjectReferenceRedirect": true
  },

  "references": [{ "path": "../path-to-package1" }, { "path": "../path-to-package2" }]
}
```

3. For every package in the workspace, create a `tsconfig.json` file that extends from the root `tsconfig.build.json`
   file (and depending on use case, a `tsconfig.dev.json` that extends from the root `tsconfig.dev.json` file).

```json
{
  // Extend from the build config
  "extends": "../../tsconfig.build.json",

  // Compiler options
  "compilerOptions": {
    // Compiled output JS and source maps output directory
    "outDir": "./dist",

    // Source root directory
    "rootDir": "./src"
  },

  "include": ["./src", "./types"],

  // Setup project references
  "references": [{ "path": "../path-to-package2" }]
}
```

Use `references` path list to allow Typescript to pickup other packages in the workspace and typing information to be
extracted.

## Changelog

See [CHANGELOG.md](CHANGELOG.md) for the latest changes.

---
_Source: https://npm.io/package/@lottiefiles/tsconfig · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._