# 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


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.wproofreader.com/integrations/initialization/initialization-options/initialize-using-npm-sdk.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
