### Install Enigma.js and Bluebird

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/enigma.js/README.md

Install the enigma.js library and the Bluebird promise library, which is used in the example configuration.

```bash
npm install --save enigma.js
```

```bash
npm install --save bluebird
```

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

### Install All Dependencies

Source: https://github.com/definitelytyped/definitelytyped/blob/master/README.md

Installs all dependencies for the entire Definitely Typed repository.

```bash
pnpm install
```

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

### Full TableOptions Extension Example

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/react-table/Readme.md

This example shows a comprehensive extension of `TableOptions` that includes a wide range of plugin options. It serves as a starting point before tailoring it to specific plugin usage.

```tsx
extends UseExpandedOptions<D>,
  UseFiltersOptions<D>,
  UseGroupByOptions<D>,
  UsePaginationOptions<D>,
  UseRowSelectOptions<D>,
  UseSortByOptions<D>,
  UseFiltersOptions<D>,
  UseResizeColumnsOptions<D>,
  Record<string, any> {}
```

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

### Install @types/phoenix_live_view

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/phoenix_live_view/README.md

Install the type definitions for Phoenix LiveView as a development dependency.

```bash
npm install --save-dev @types/phoenix_live_view
```

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

### Install @types/fbt

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/fbt/README.md

Install the fbt type definitions using npm.

```bash
npm install --save @types/fbt
```

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

### Implementation package.json example

Source: https://github.com/definitelytyped/definitelytyped/blob/master/README.md

Example of a package.json file from an implementation package, demonstrating 'type' and 'exports' fields.

```json
{
    "name": "my-package",
    "version": "1.0.1",
    "type": "module",
    "main": "dist/cjs/index.cjs",
    "exports": {
        ".": {
            "import": "./dist/esm/index.js",
            "require": "./dist/cjs/index.cjs"
        },
        "./subpath": {
            "import": "./dist/esm/subpath.js",
            "require": "./dist/cjs/subpath.cjs"
        }
    }
}
```

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

### Install @types/gapi.client

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/gapi.client/readme.md

Install the @types/gapi.client package as a development dependency. This package is required for using other @types/gapi.client.* packages.

```bash
npm install @types/gapi.client --save-dev
```

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

### Install Node.js Types with npm

Source: https://github.com/definitelytyped/definitelytyped/blob/master/README.md

Use this command to install the development types for Node.js.

```sh
npm install --save-dev @types/node
```

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

### Install @types/rax

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/rax/README.md

Install the @types/rax package using npm.

```bash
npm install --save @types/rax
```

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

### Install Enigma.js Type Definitions

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/enigma.js/README.md

Install the type definitions for enigma.js using npm.

```bash
npm install --save @types/enigma.js
```

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

### Install Subset of Dependencies

Source: https://github.com/definitelytyped/definitelytyped/blob/master/README.md

Installs a subset of dependencies for a specific package and its dependencies.

```bash
pnpm install -w --filter "{./types/foo}..."
```

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

### Install @types/bun

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/bun/README.md

Install the @types/bun npm package as a development dependency using Bun. Yarn, npm, and pnpm also work for installing this package.

```bash
bun add -D @types/bun
```

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

### LocalStorage Bucket Store Provider

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/simperium/README.md

Implements a custom bucket store using browser's localStorage for persistence. This example focuses on the `get` method and assumes `localStorage` is available.

```typescript
import type {
    BucketObject,
    BucketStore,
    EntitiesCallback
    EntityCallback,
    EntityId
} from 'simperium';

class LocalStorageBucket<T> implements BucketStore<T> {
    prefix: string;

    constructor(storagePrefix: string) {
        this.prefix = storagePrefix;
    }

    get(id: EntityId, callback: EntityCallback<BucketObject<T>>) {
        const entity = localStorage.getItem( `${ this.prefix }.${ id }` );

        if ( null === entity ) {
            callback( new Error( 'missing entity' ), null );
        } else {
            try {
                callback( null, { id, data: JSON.parse( entity ) } );
            } except (e) {
                callback( new TypeError('unable to decode entity'), null );
            }
        }
    }

    …
```

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

### Install Related Packages for Testing

Source: https://github.com/definitelytyped/definitelytyped/blob/master/README.md

Installs related packages needed for testing a specific package.

```bash
pnpm install -w --filter "...{./types/foo}..."
```

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

### Install node-forge and types

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/node-forge/README.md

Install the node-forge library and its corresponding TypeScript types using npm.

```bash
npm install --save-dev @types/node-forge
npm install --save node-forge
```

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

### Install @types/serverless-tencent-scf

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/serverless-tencent-scf/README.md

Install the type definitions for Tencent Cloud Serverless Cloud Function. Note that this package only provides type definitions and is not related to the serverless-tencent-scf package itself.

```bash
npm install --save-dev @types/serverless-tencent-scf
```

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

### Install cordova_app_version_plugin Types

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/cordova_app_version_plugin/README.md

Install the type definitions for cordova_app_version_plugin as a development dependency.

```bash
npm install --save-dev @types/cordova_app_version_plugin
```

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

### Example package.json for Definitely Typed

Source: https://github.com/definitelytyped/definitelytyped/blob/master/README.md

This is a template for the `package.json` file, specifying private status, package name, version, projects, dependencies, devDependencies, and owners.

```json
{
    "private": true,
    "name": "@types/PACKAGE-NAME",
    "version": "1.2.9999",
    "projects": [
        "https://aframe.io/"
    ],
    "dependencies": {
        "@types/DEPENDENCY-1": "*",
        "@types/DEPENDENCY-2": "*"
    },
    "devDependencies": {
        "@types/PACKAGE-NAME": "workspace:."
    },
    "owners": [
        {
            "name": "Your Name Here",
            "githubUsername": "ghost"
        }
    ]
}
```

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

### Add patch-package to postinstall script

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/fbt/README.md

Configure the package.json to run patch-package after installation to apply custom patches to installed packages.

```json
"scripts": {
+  "postinstall": "patch-package"
}

```

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

### Install CDS Type Definitions via Yarn

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/consumer-data-standards/README.md

Install the CDS type definitions package as a development dependency using Yarn.

```bash
yarn install @types/consumer-data-standards
```

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

### Rax useReducer Example

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/rax/README.md

Demonstrate the use of Rax.useReducer for state management with a reducer function and initial state.

```tsx
interface AppState {
  name: string;
  age: number;
}

type AppActions = { type: 'getOlder' } | { type: 'resetAge' };

function reducer(s: AppState, action: AppActions): AppState {
  switch (action.type) {
    case 'getOlder':
      return { ...s, age: s.age + 1 };
    case 'resetAge':
      return { ...s, age: 0 };
  }
}

const initialState = {
  name: 'Rax',
  age: 18
};
```

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

### DefinitelyTyped package.json example

Source: https://github.com/definitelytyped/definitelytyped/blob/master/README.md

Example of a corresponding package.json for a DefinitelyTyped package, matching the structure of the implementation's 'exports'. Note the use of '.d.ts' and '.d.cts' for declaration files.

```json5
{
    "name": "@types/my-package",
    "version": "1.0.9999",
    "type": "module",
    "types": "index.d.ts",
    "exports": {
        ".": {
            "import": "./index.d.ts",
            "require": "./index.d.cts"
        },
        "./subpath": {
            "import": "./subpath.d.ts",
             "require": "./subpath.d.cts"
        }
    }
}
```

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

### Install Tableau JS API Types with yarn

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/tableau-js-api/README.md

Install the type definitions as a development dependency using yarn.

```bash
yarn add @types/tableau-js-api --dev
```

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

### Install Tableau JS API Types with npm

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/tableau-js-api/README.md

Install the type definitions as a development dependency using npm.

```bash
npm install @types/tableau-js-api --save-dev
```

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

### Run Type Generation Script

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/facebook-nodejs-business-sdk/scripts/README.md

Execute this command from the repository root to start the TypeScript type generation process for the facebook-nodejs-business-sdk.

```bash
pnpm run gen-types
```

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

### Install Forge APIs Types

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/forge-apis/README.md

Use either Yarn or npm to install the @types/forge-apis package as a development dependency.

```bash
yarn add --dev @types/forge-apis
```

```bash
npm install --save-dev @types/forge-apis
```

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

### Install CDS Type Definitions via npm

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/consumer-data-standards/README.md

Install the CDS type definitions package as a development dependency using npm.

```bash
npm install @types/consumer-data-standards
```

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

### Install Google Apps Script OAuth2 Types

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/google-apps-script-oauth2/README.md

Install the types package using npm. This is a development dependency.

```bash
npm install --save-dev @types/google-apps-script-oauth2
```

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

### Instantiate and Use Custom Resource

Source: https://github.com/definitelytyped/definitelytyped/wiki/AngularJS-Definitions-Usage-Notes

Instantiate a resource using $resource, providing the URL, default parameters, and custom action configurations. Then, use the custom actions and default methods like get() and $save().

```typescript
var articles = <IArticleResourceClass> $resource('/articles/:id', null, {
            publish : publishDescriptor,
            unpublish : unpublishDescriptor
        });     

        // Now we can do this
        articles.unpublish({ id: 1 });
            
        // IResourceClass.get() will be automatically available here
        var article = <IArticleResource> articles.get({id: 1});

        // Again, default + custom action here...
        article.title = 'New Title';
        article.$save();
        article.$publish();
```

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

### Simperium Client with Custom Storage

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/simperium/README.md

Configures the Simperium client to use custom storage providers for buckets and ghosts, enabling persistence. This example shows how to pass the providers during client creation.

```typescript
const client = createClient<Buckets>( 'my-app-id', 'my-token', {
    objectStoreProvider: bucket => new LocalStorageBucket( bucket.name ),
    ghostStoreProvider: bucket => new LocalStorageGhost( bucket.name )
} );
```

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

### Node.js types package.json example

Source: https://github.com/definitelytyped/definitelytyped/blob/master/README.zh-Hans.md

This example shows how the version in `@types/node`'s `package.json` is used to align with the corresponding Node.js library version. The `.9999` suffix is a convention for Definitely Typed packages.

```json
{
    "private": true,
    "name": "@types/node",
    "version": "20.8.9999"
}
```

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

### Install DefinitelyTyped dwt types

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/dwt/README.md

Use npm to install the @types/dwt package. This command adds the type definitions to your project.

```bash
npm install --save @types/dwt
```

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

### Rax FunctionComponent Example

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/rax/README.md

Define a Rax FunctionComponent with props and render it using Rax.createElement.

```tsx
import * as Rax from 'rax';

const createElement = Rax.createElement;

// FunctionComponent
interface PersonProps {
  name: string;
  age: number;
}
const Person: Rax.FunctionComponent<PersonProps> = (props) => {
  return (
    <text>
      hello! I'm {props.name} and I'm {props.age} years old!
    </text>
  );
};
```

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

### Install Scoped Module Types with npm

Source: https://github.com/definitelytyped/definitelytyped/blob/master/README.md

To install typings for a scoped module like @babel/preset-env, remove the '@' and add a double-underscore after the scope.

```sh
npm install --save-dev @types/babel__preset-env
```

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

### Setup Git Hooks for Automatic Formatting

Source: https://github.com/definitelytyped/definitelytyped/blob/master/README.md

Enables automatic code formatting using dprint on commit. Run this command in your project's root directory.

```bash
pnpm run setup-hooks
```

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

### Package Depending on Versioned Type Declarations

Source: https://github.com/definitelytyped/definitelytyped/blob/master/README.md

Example package.json demonstrating how another package can specify a dependency on a specific major version of type declarations, such as version 2 of `@types/history`.

```json
{
    "private": true,
    "name": "@types/browser-sync",
    "version": "2.26.9999",
    "dependencies": {
        "@types/history": "^2"
    }
}
```

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

### Browser-sync tsconfig.json Path Mapping

Source: https://github.com/definitelytyped/definitelytyped/blob/master/README.pt.md

This example demonstrates how to add a path mapping in tsconfig.json to point to an older version of a dependency. This is necessary when a package depends on a specific major version of another package that has since been updated.

```json
"micromatch": [ "micromatch/v2" ]
```

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

### History v2 tsconfig.json Example

Source: https://github.com/definitelytyped/definitelytyped/blob/master/README.pt.md

This tsconfig.json configuration is used for older versions of a library to maintain compatibility. It sets up baseUrl, typeRoots, and path mappings to ensure that the correct version of the type declaration is used.

```json
{
    "compilerOptions": {
        "baseUrl": "../../",
        "typeRoots": ["../../"],
        "paths": {
            "history": ["history/v2"]
        }
    },
    "files": [
        "index.d.ts",
        "history-tests.ts"
    ]
}
```

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

### Rax App Component with Hooks

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/rax/README.md

An example Rax application component demonstrating the integration of Person, FancyButton, and state management using useReducer, useRef, and useLayoutEffect.

```tsx
export function App() {
  const [state, dispatch] = Rax.useReducer(reducer, initialState);
  const birthdayRef = Rax.useRef<FancyButton>(null);

  Rax.useLayoutEffect(() => {
    if (birthdayRef.current !== null) {
      birthdayRef.current.getClickCount();
    } else {
      // this looks redundant but it ensures the type actually has "null" in it instead of "never"
      // $ExpectType null
      console.log(birthdayRef.current);
    }
  });

  return (
    <Rax.Fragment>
      <Person {...state} />
      <FancyButton
        onClick={() => {
          if (birthdayRef.current !== null) {
            console.log(birthdayRef.current.getClickCount());
          }
          dispatch({ type: 'getOlder' });
        }}
        ref={birthdayRef}
      >
        Birthday time!
      </FancyButton>
      <FancyButton onClick={() => dispatch({ type: 'resetAge' })}>Let's start over.</FancyButton>
    </Rax.Fragment>
  );
}

export default App;
```

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

### Basic Controller with $scope

Source: https://github.com/definitelytyped/definitelytyped/wiki/AngularJS-Definitions-Usage-Notes

An example of a basic AngularJS controller function that accepts the $scope object. This version does not have explicit type annotations.

```javascript
function Controller($scope) {
    $scope.$broadcast('myEvent');
    $scope.title = 'Yabadabadu';
}
```

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

### History Type Declarations Package.json for v2

Source: https://github.com/definitelytyped/definitelytyped/blob/master/README.md

Example package.json for a versioned subfolder of type declarations, specifically for version 2 of the history library. The version `2.4.9999` aligns with the library's major.minor version 2.4.x.

```json
{
    "private": true,
    "name": "@types/history",
    "version": "2.4.9999"
}
```

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

### Export Default in DTS Files

Source: https://github.com/definitelytyped/definitelytyped/blob/master/docs/admin.md

Demonstrates the correct way to handle `export default` in Definitely Typed declaration files. The first example shows an incorrect usage, while the second shows the correct way to export a default object.

```typescript
// Cannot have `export default` in the dts
module.exports = {
    thing: () => "hello world",
};

```

```typescript
// Can import via `export default`
module.exports.default = {
    thing: () => "hello world",
};

```

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

### Example of typesVersions directory structure

Source: https://github.com/definitelytyped/definitelytyped/blob/master/README.zh-Hans.md

When using `typesVersions`, create subdirectories (e.g., `ts3.6/`) for older TypeScript versions. Copy type declarations and test files into these subdirectories and remove the type definition header from their `index.d.ts` files.

```typescript
// Minimum TypeScript Version: X.Y
```

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

### Configure typesVersions for different TypeScript versions

Source: https://github.com/definitelytyped/definitelytyped/blob/master/README.zh-Hans.md

Use `typesVersions` in `package.json` to support multiple TypeScript versions. This allows different type definitions to be used based on the installed TypeScript version.

```json
{
    "private": true,
    "types": "index",
    "typesVersions": {
        "<=3.6": { "*": ["ts3.6/*"] }
    }
}
```

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

### LiveView Hook with Extended Prototype

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/phoenix_live_view/README.md

Extend a LiveView hook's prototype with custom methods like `handleClick` and manage event listeners. This example demonstrates using `Hook` as a generic to add custom properties and methods.

```typescript
const testHookWithExtendedPrototype: Hook<{ handleClick: (event: MouseEvent) => void }> = {
    mounted() {
        this.handleClick = (event: MouseEvent) => {
            console.log("click", event);
            this.pushEvent("click", { x: event.clientX, y: event.clientY });
        };
        document.addEventListener("click", this.handleClick);
    },
    destroyed() {
        document.removeEventListener("click", this.handleClick);
    },
};

const MyHooks: HooksOptions = {
    testWithExtendedPrototype: testHookWithExtendedPrototype,
};

const liveSocket = new LiveSocket("/live", Socket, opts);
```

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

### Node.js Type Declarations Package.json

Source: https://github.com/definitelytyped/definitelytyped/blob/master/README.md

Example package.json for Node.js type declarations. The version number `20.8.9999` indicates alignment with library version `20.8.x`. The `.9999` suffix is used to ensure local `@types` packages are the newest during development.

```json
{
    "private": true,
    "name": "@types/node",
    "version": "20.8.9999"
}
```

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

### Create and Use Simperium Client

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/simperium/README.md

Demonstrates how to create a Simperium client with typed buckets, authenticate, add data, and handle updates and authorization events.

```typescript
import { default as createClient, Auth } from 'simperium';

interface Project {
    name: string;
    authors: string[];
    version: string;
    includesTypes: boolean;
    stars: number;
}

interface Language {
    name: string;
    projects: string[];
}

interface Buckets {
    projects: Project;
    languages: Language;
}

new Auth( 'my-app-id', 'my-api-key' )
    .authorize( 'username', 'password' )
    .then( ( { access_token } ) => {
        const client = createClient<Buckets>( 'my-app-id', access_token );
        const projectBucket = client.bucket('projects');
        const languageBucket = client.bucket('languages');

        projectBucket.add( {
            name: 'simperium',
            authors: [ 'beaucollins', 'roundhill', 'dmsnell', 'belcherj' ],
            version: '1.1.1',
            includesTypes: true,
            stars: 65
        } );

        languageBucket.add( {
            name: 'flowtyped',
            projects: [ 'simperium' ]
        } );

        languageBucket.add( {
            name: 'typescript',
            projects: [ 'simperium' ]
        } );

        projectBucket.on( 'update', ( id, project ) => {
            console.log( `Discovered a new project: ${ project.name }` );
        } );

        client.on( 'unauthorized', () => {
            console.log( 'All good things must come to an end.' );
            process.exit( 0 );
        } );
    } );
```

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

### Create and Connect to Enigma.js Session

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/enigma.js/README.md

Demonstrates how to create an Enigma.js session with a specific schema and URL, and how to open the session to retrieve the engine version. Ensure the QIX schema file is correctly referenced.

```typescript
import * as enigma from "enigma.js";
import * as blubird from "bluebird";

let qixSchema = require("./node_modules/enigma.js/schemas/12.20.0.json");

let enigmaConfig: enigmaJS.IConfig = {
    Promise: blubird,
    schema: qixSchema,
    url: "ws://localhost:4848/"
};

let session = enigma.create(enigmaConfig);

session.on("traffic:sent", data => console.log("sent:", data));

session.open()
    .then((global: EngineAPI.IGlobal) => {
        return global.EngineVersion();
    })
    .then((version) => {
        console.log(version);
    });

```

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

### Cast Form Fields to HTMLInputElement

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/meteor/README.md

Cast form fields to `<HTMLInputElement>` when working with them, for example, to read their value.

```javascript
(<HTMLInputElement>evt.target).value
```

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

### Add Meteor TypeScript Package

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/meteor/README.md

Install the official Meteor TypeScript package in a Meteor application version 1.8.2 or later.

```bash
meteor add typescript
```

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

### Use fbt with TypeScript 4.2+

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/fbt/README.md

Example of using fbt components with XML namespaces in JSX for TypeScript 4.2 and later.

```tsx
// App.tsx
import React from "react";
import fbt from "fbt";

const name = "Mary";

function App() {
  return (
    <fbt desc="param example">
      Hello,
      <fbt:param name="name">{name}</fbt:param>.
    </fbt>
  );
}
```

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

### Generating FP Types

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/lodash/readme.md

Command to re-generate Lodash functional programming types. Ensure you have installed dependencies in the scripts directory first.

```bash
npm run generate
```

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

### Initialize Twitch Player

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/twitch-browser/readme.md

Instantiate a new Twitch player. Ensure the provided 'div-id' matches an existing HTML element's ID. 'width', 'height', and 'parent' are required parameters.

```typescript
new Twitch.Player('div-id', {
    width: 100,
    height: 100,
    parent: ['yourUrl.com']
})
```

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

### Basic LiveView Hook Implementation

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/phoenix_live_view/README.md

Implement a basic LiveView hook with `mounted` and `pushEvent` functionality. The `Hook` interface provides access to `this.el` and `this.pushEvent`.

```typescript
const testHook: Hook = {
    mounted() {
        const hook = this;
        console.log("TestHook mounted", { element: this.el });
        hook.pushEvent("hook-mounted", { name: "testHook" }, (reply: object, ref: number) => {
            console.log(`Got hook-mounted reply ${JSON.stringify(reply)} ref ${ref}`);
        });
    },
};

const MyHooks: HooksOptions = {
    test: testHook,
};

const liveSocket = new LiveSocket("/live", Socket, opts);
```

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

### Expose Private TextBuffer Method

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/text-buffer/README.md

Use declaration merging to augment TextBuffer types and expose private methods. This example reveals the 'emitDidStopChangingEvent' method.

```typescript
// <<filename>>.d.ts

declare namespace TextBuffer {
  interface TextBuffer {
    emitDidStopChangingEvent(): void;
  }
}
```

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

### Generate Ed25519 Key Pair with node-forge

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/node-forge/README.md

Example of generating an Ed25519 key pair using the node-forge library and checking if the public key is a Buffer.

```typescript
import * as forge from "node-forge";

Buffer.isBuffer(forge.pki.ed25519.generateKeyPair().publicKey) // true
```

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

### Generate Protobuf TypeScript Definitions

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/sawtooth-sdk/README.md

Use `pbjs` and `pbts` to generate TypeScript definitions for SDK protobuf files. This command should be run from the cloned `sawtooth-sdk-javascript` repository.

```sh
git clone https://github.com/hyperledger/sawtooth-sdk-javascript.git
cd sawtooth-sdk-javascript
npm install
npx pbjs -t static-module -w commonjs $(ls -d protos/*.proto) | npx pbts -o index.d.ts -
```

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

### Define and Use Generic React-Autosuggest Component

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/react-autosuggest/README.md

Example of defining a generic LanguageAutosuggest component using TypeScript generics. Ensure you have the necessary imports and types defined.

```jsx
import * as Autosuggest from 'react-autosuggest'
interface Language {
    name: string
    year: number
}

const LanguageAutosuggest = Autosuggest as { new (): Autosuggest<Language> }

<LanguageAutosuggest
    suggestions={suggestions}
    onSuggestionsFetchRequested={this.onSuggestionsFetchRequested.bind(this)}
    getSuggestionValue={this.getSuggestionValue}
    renderSuggestion={this.renderSuggestion}
    onSuggestionSelected={this.onSuggestionsSelected}
    alwaysRenderSuggestions={true}
    inputProps={inputProps}
    theme={theme}
/>
```

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

### Loading Template and Resources in TypeScript

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/dojo/README.md

This TypeScript code demonstrates how to load template and internationalization resources using `require`. It's necessary for Dojo's plugin-type modules.

```typescript
var template:string = require("dojo/text!./templates/Foo.html");
var res = require("dojo/i18n!app/common/nls/resources");
```

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

### Use fbt with older TypeScript (3.9-4.2)

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/fbt/README.md

Example of using fbt components with camelCase variants for TypeScript versions 3.9-4.2, which do not support XML namespaces in JSX.

```tsx
// App.tsx
import React from "react";
import { fbt, FbtParam } from "fbt";

const name = "Mary";

function App() {
  return (
    <fbt desc="param example">
      Hello,
      <FbtParam name="name">{name}</FbtParam>.
    </fbt>
  );
}
```

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

### Implement Destruction Listener in Box2DWeb

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/box2d/README.md

Handle object destruction events by implementing the b2DestructionListener interface. This example shows how to define a custom listener for fixture destruction.

```typescript
var world = new Box2D.Dynamics.b2World(new Box2D.Common.Math.b2Vec2(0, 10), true);

/* ... add bodies, etc. ... */

var myListener = new Box2D.Dynamics.b2DestructionListener;

myListener.SayGoodbyeFixture = function(fixture) {
   alert("goodbye fixture ...");
}

world.SetDestructionListener(myListener);
```

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

### Declare a Module for Testing

Source: https://github.com/definitelytyped/definitelytyped/blob/master/README.md

Create a 'typename.d.ts' file and declare a module to test your type definitions locally.

```typescript
declare module "libname" {
    // Types inside here
    export function helloWorldMessage(): string;
}
```

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

### .npmignore for multi-version packages

Source: https://github.com/definitelytyped/definitelytyped/blob/master/README.md

For packages with multiple versions, this `.npmignore` ignores all files except declaration files and specific version directories.

```ignore
*
!**/*.d.ts
!**/*.d.cts
!**/*.d.mts
!**/*.d.*.ts
/v15/
/v16/
/v17/
```

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

### Layui table checkbox event handler with TypeScript typing

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/layui-src/README.md

Example of handling the 'checkbox' event for a Layui table and explicitly typing the callback object as `Layui.TableOnCheckbox` in TypeScript.

```typescript
// 点击table中复选框，回调参数对象指定类型
layui.table.on('checkbox(test)', obj => {
    const data: Layui.TableOnCheckbox = obj;
    data.del;
    data.checked;
    data.tr[0];
    data.type;
    data.update({});
});
```

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

### TypeScript type assertion for HTML element

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/layui-src/README.md

Demonstrates how to get an HTML element by its ID and use a TypeScript type assertion (`@ts-ignore` and explicit type) to treat it as an `HTMLButtonElement`.

```typescript
// 这种需要手动确定返回类型。。。
var elem = document.getElementById('btn01'); //<button id="btn01"></button>
if (elem) {
    // @ts-ignore
    const el: HTMLButtonElement = elem;
```

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

### Configure Require.js with Paths and Shims

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/requirejs/README.md

Configure require.js to manage module loading, define base URLs, map module names to file paths, and specify dependencies and export values for non-AMD libraries.

```typescript
//file config.ts
require.config({
	baseUrl: 'lib',

	paths: {
		'jquery': 'lib/jquery-x.x.x',
		'underscore': 'lib/underscore-x.x.x',
		'backbone': 'lib/backbone-x.x.x'
	},

	shim: {
		jquery: {
			exports: '$'
		},

		underscore: {
			exports: '_'
		},

		backbone: {
			deps: ['underscore', 'jquery'],
			exports: 'Backbone'
		}
	}
});

// load AMD module main.ts (compiled to main.js)
// and include shims $, _, Backbone

require(['main'], (main, $, _, Backbone) => {

	var app = main.AppMain();
	app.run();

});
```

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

### Import TextBuffer Class

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/text-buffer/README.md

Use the require syntax to import the TextBuffer class. This is the primary export of the 'text-buffer' module.

```typescript
import TextBuffer = require("text-buffer");
```

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

### Run Icon Definition Generation Script

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/tonic-ui__react-icons/scripts/generate-definitions/README.md

Execute the `generate-definitions` script using `ts-node` from the `types/tonic-ui__react-icons` directory. This script is responsible for creating the type definitions for the icon components.

```sh
# cwd = types/tonic-ui__react-icons
ts-node -P scripts/generate-definitions/tsconfig.json scripts/generate-definitions
```

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

### Run Material-UI Generator

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/material-ui/scripts/README.md

Execute the material-ui generator script using Node.js.

```sh
node scripts/material-ui/generate.js
```

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

### Test a Specific Package

Source: https://github.com/definitelytyped/definitelytyped/blob/master/README.md

Run tests for a specific package within the Definitely Typed repository.

```bash
pnpm test <package to test>
```

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

### Import Trusted Types Types for Libraries

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/trusted-types/README.md

This example shows how library authors can import Trusted Types types without polluting the global scope. It requires explicitly importing types and casting the window object.

```typescript
import {TrustedHTML, TrustedTypePolicy, TrustedTypesWindow} from '@types/trusted-types/lib';

const ttWindow = window as unknown as TrustedTypesWindow;
if (ttWindow.trustedTypes) {
  // ...
}
```

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

### Importing Lodash Modules

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/lodash/readme.md

Demonstrates various ways to import Lodash functions and the main module, including direct imports, functional programming variants, and namespace imports.

```typescript
import * as _ from "lodash"
```

```typescript
import * as _ from "lodash/fp"
```

```typescript
import { flatMap } from "lodash"
```

```typescript
import { flatMap } from "lodash/fp"
```

```typescript
import * as flatMap from "lodash/flatMap"
```

```typescript
import * as flatMap from "lodash/fp/flatMap"
```

```typescript
import * as flatMap from "lodash.flatmap"
```

```typescript
import _ = require("lodash")
```

```typescript
import _ from "lodash"
```

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

### Import KeymapManager

Source: https://github.com/definitelytyped/definitelytyped/blob/master/types/atom-keymap/README.md

Use this syntax to import the KeymapManager class from the atom-keymap module.

```typescript
import KeymapManager = require("atom-keymap");
```

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

### Configure Resource Actions

Source: https://github.com/definitelytyped/definitelytyped/wiki/AngularJS-Definitions-Usage-Notes

Configure custom action descriptors for HTTP methods and array responses. These descriptors are used when creating the resource.

```typescript
var publishDescriptor: ng.resource.IActionDescriptor;
        publishDescriptor = {
            method: 'GET',
            isArray: false
        };

        // I could still create a descriptor without the interface...
        var unpublishDescriptor = {
            method: 'POST'
        }
```