open-index/open-npm huggingface dataset:
npm package: @gleam-tools/ts
Description: get type safety when importing .gleam from javascript
Author: Jose Albizures
Latest version: 0.0.4

# ts-gleam [![npm](https://img.shields.io/npm/v/@gleam-tools/ts)](https://npmjs.com/package/@gleam-tools/ts)

TypeScript LSP Plugin for importing [Gleam](https://gleam.run) files.

## Usage

1. Create a new Gleam project.
2. In `gleam.toml`, set `target=javascript` and under `[javascript]` set `typescript_declarations=true`.
3. `npm add @gleam-tools/ts`
4. Create a `tsconfig.json`/`jsconfig.json` and set `compilerOptions.plugins` to `[{"name": "@gleam-tools/ts"}]`
5. Build your Gleam project when ever you have changes and import away!

## Note

This **does not** build and resolve imports for your. All this is, is for the LSP to type check correctly.
For building with Gleam/JavaScript, check out [`@gleam-tools/vite`](https://github.com/albizures/gleam-tools/tree/master/packages/vite)
npm package: @gleam-tools/utils
Description: Common utilities for Gleam Tools
Author: Jose Albizures
Latest version: 0.0.4

# Utis [![npm](https://img.shields.io/npm/v/@gleam-tools/utils)](https://npmjs.com/package/@gleam-tools/utils)

A collection of utilities for the Gleam Tools

## Usage

## API
### assert
Assert function

### isGleamFile
Check if a file is a Gleam file

### isJsFile
Check if a file is a JavaScript file

### readJsFile
Read a Gleam file and return its content

### getJsFilePath
Get the path of the JavaScript file generated from a Gleam file

### build
Build the project using Gleam

### readGleamConfig
Read the Gleam configuration file

### readSyncGleamConfig
Read the Gleam configuration file

### getDeclarationFilePath
Get the path of the declaration file generated from a Gleam file

## Note

This is only for internal use and should not be used outside of the Gleam Tools project.
npm package: @gleam-tools/vite
Description: Import directly from *.gleam files using Vite
Author: Jose Albizures
Latest version: 0.0.3

# @gleam-tools/vite [![npm](https://img.shields.io/npm/v/@gleam-tools/vite)](https://npmjs.com/package/@gleam-tools/vite)

Import from [Gleam](https://gleam.run/) (`*.gleam`) files directly.

## Usage

1. `npm i @gleam-tools/vite`
2. Create a basic Vite project (`npm create vite`)
3. Create a `gleam.toml` and add Gleam dependencies
4. Update your vite config

```ts
// vite.config.{ts,js}
import { gleam } from '@gleam-tools/vite'

export default {
	plugins: [gleam()],
}
```

5. Start importing from Gleam!

## API


## Note

By default, TypeScript (LSP) will complain about importing files with the `.gleam` extension. There are two choices for fixes:

- If the type of the import doesn't matter , add `declare module "*.gleam";` inside any TypeScript file. A caveat is the LSP does not know if an export exists so it will not provide autocompletion when importing a Gleam file and it will type exports as `any`.
- Alternatively, if the vite dev server is running you can have full type safety when importing from Gleam. `npm i @gleam-tools/ts`. Create a `tsconfig.json`/`jsconfig.json` and set `compilerOptions.plugins` to `[{"name": "@gleam-tools/ts"}]` (**RECOMMENDED**)
npm package: @glean-dev/svelte-language-server
Description: A language server for Svelte
Author: James Birtles
Latest version: 0.10.1

# Svelte Language Server

A language server (implementing the [language server protocol](https://microsoft.github.io/language-server-protocol/))
for Svelte.

## What is a language server?

From https://microsoft.github.io/language-server-protocol/overview

> The idea behind a Language Server is to provide the language-specific smarts inside a server that can communicate with development tooling over a protocol that enables inter-process communication.

In simpler terms, this allows editor and addon devs to add support for svelte specific 'smarts' (e.g. diagnostics, autocomplete, etc) to any editor without reinventing the wheel.

## Features

Svelte language server is under development and the list of features will surely grow over time.

Currently Supported:

-   Svelte
    -   Diagnostic messages for warnings and errors
    -   Svelte specific formatting (via [prettier-plugin-svelte](https://github.com/UnwrittenFun/prettier-plugin-svelte))
-   HTML (via [vscode-html-languageservice](https://github.com/Microsoft/vscode-html-languageservice))
    -   Hover info
    -   Autocompletions
    -   [Emmet](https://emmet.io/)
    -   Symbols in Outline panel
-   CSS / SCSS / LESS (via [vscode-css-languageservice](https://github.com/Microsoft/vscode-css-languageservice))
    -   Diagnostic messages for syntax and lint errors
    -   Hover info
    -   Autocompletions
    -   Formatting (via [prettier](https://github.com/prettier/prettier))
    -   [Emmet](https://emmet.io/)
    -   Color highlighting and color picker
    -   Symbols in Outline panel
-   TypeScript / JavaScript (via TypeScript)
    -   Diagnostics messages for syntax errors, semantic errors, and suggestions
    -   Hover info
    -   Formatting (via [prettier](https://github.com/prettier/prettier))
    -   Symbols in Outline panel
    -   Autocompletions
    -   Go to definition
    -   Code Actions

## How can I use it?

Install a plugin for your editor:

-   [VS Code](https://github.com/UnwrittenFun/svelte-vscode)
-   [Atom](https://github.com/UnwrittenFun/svelte-atom)