> For the complete documentation index, see [llms.txt](https://docs.wproofreader.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.wproofreader.com/v6.12.0/integrations/initialization/initialization-options/initialize-using-npm-sdk.md).

# Initialize using npm SDK

The [WProofreader SDK npm package](https://www.npmjs.com/package/@webspellchecker/wproofreader-sdk-js) is designed for JavaScript framework projects (React, Angular, Vue) or setups where you use multiple editors and want a single proofreading dependency. It works with any supported editor and HTML editable element.

[See framework examples with CKEditor 4, TinyMCE, Froala, and Quill →](https://github.com/WebSpellChecker/wproofreader-sdk-js/tree/master/examples)

#### Install the package

```bash
npm install @webspellchecker/wproofreader-sdk-js
```

#### Import and configure

Import the SDK in the file that initializes your application. Call `configure()` once to set global options. This must happen before any `init()` calls.

**Cloud:**

```js
import WProofreaderSDK from '@webspellchecker/wproofreader-sdk-js';

WProofreaderSDK.configure({
  autoSearch: true,
  lang: 'en_US',
  serviceId: 'your-service-ID'
});
```

**Self-hosted:**

```js
import WProofreaderSDK from '@webspellchecker/wproofreader-sdk-js';

WProofreaderSDK.configure({
  autoSearch: true,
  lang: 'en_US',
  serviceProtocol: 'https',
  serviceHost: 'your_host_name',
  servicePort: '443',
  servicePath: 'wscservice/api',
  srcUrl: 'https://your_host_name/wscservice/wscbundle/wscbundle.js'
});
```

With `autoSearch` enabled, WProofreader will activate automatically when any editable element receives focus. You don't need to do anything else.

#### Force initialization on a specific element

If you don't want to wait for `autoSearch` and need proofreading to start immediately, call `init()` on a specific container:

```js
WProofreaderSDK.init({
  container: document.getElementById('your-editable-element')
});
```

#### TypeScript support

Starting from version 1.1.0, the package includes type definitions (`.d.ts`) for core methods, initialization, configuration, and instance management. Refer to the [Angular example →](https://github.com/WebSpellChecker/wproofreader-sdk-js/tree/master/examples) for a TypeScript integration sample.

#### Related resources

* [npm package →](https://www.npmjs.com/package/@webspellchecker/wproofreader-sdk-js)
* [GitHub repository →](https://github.com/WebSpellChecker/wproofreader-sdk-js) with framework examples for React, Angular, and Vue
* [Configuration reference →](https://webspellchecker.com/docs/api/wscbundle/Options.html) for the full list of available options