## Getting Started
**Note:** See the [docs] for more information.
**Note**: This package is [ESM-only].
Creating a new project
You can use the [`create-sveltex`] package to create a new project using SvelTeX:
```sh
pnpm dlx create-sveltex # If using PNPM
bunx create-sveltex # If using Bun
npx create-sveltex # If using NPM
yarn dlx create-sveltex # If using Yarn
```
...and follow the prompts.
### Adding to an existing project
#### Installation
```sh
pnpm add -D @nvl/sveltex # If using PNPM
bun add -D @nvl/sveltex # If using Bun
npm add -D @nvl/sveltex # If using NPM
yarn add -D @nvl/sveltex # If using Yarn
deno add -D @nvl/sveltex # If using Deno
```
#### Basic steup
```js
// svelte.config.js
import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';
import { sveltex } from '@nvl/sveltex';
/** @type {import('@sveltejs/kit').Config} */
const config = {
preprocess: [
vitePreprocess(), // (optional)
await sveltex({
markdownBackend: 'unified',
codeBackend: 'shiki',
mathBackend: 'mathjax',
}, {
// Options
}),
],
extensions: ['.svelte', '.sveltex'],
};
export default config;
```
Now, install the backends (see IntelliSense or the error message you'd get if
you tried to run the above code without installing the backends), and you should
be good to go. Create a `+page.sveltex` file in your `src/routes` directory, and
start adding markdown, math, code blocks, and even TeX components.
## Editor integration
For VS Code, you can install the official [SvelTeX extension] from the
marketplace. This will provide syntax highlighting for `.sveltex` files.
For other editors, you'd need to configure syntax highlighting yourself using
the SvelTeX [TextMate grammar] provided within the VS Code extension.
Proper LSP-style language support is not currently implemented. Doing so via
e.g. [request forwarding] could be an immense enrichment to the developer
experience, but it's not something I can currently commit to. Contributions for
this would be extremely welcome.
## Acknowledgments
See [acknowledgments] on the project site.
**Note:** The TSDoc comments for many of this project's interfaces, particularly
those describing options to be passed to external libraries, may be copies,
paraphrasings, or adaptations of the official documentations of the respective
libraries. Some notable examples are MathJax and TikZ.
[docs]: https://sveltex.dev/docs
[ESM-only]: https://gist.github.com/sindresorhus/a39789f98801d908bbc7ff3ecc99d99c
[`create-sveltex`]: https://www.npmjs.com/package/create-sveltex
[SvelTeX extension]: https://marketplace.visualstudio.com/items?itemName=sveltex-preprocessor.sveltex
[TextMate grammar]: ../vscode-sveltex/syntaxes
[request forwarding]: https://code.visualstudio.com/api/language-extensions/embedded-languages#request-forwarding
[acknowledgments]: https://sveltex.dev/docs/acknowledgments