Installation and Setup

Prerequisites

Node.js: v20.9.0 or higher.
Text editor: We recommend VS Code with and adding
".xylit": "js" as Language Identifier.

Install from the CLI wizard

…Comming Soon! The wizard has not been developed, yet…

Manual Setup

This guide will walk you through the steps to manually install and configure a new project. If you prefer not to use the automatic create xylit CLI tool, you can set up your project yourself by following the guide below.

Create your directory

Create an empty directory with the name of your project, and then navigate into it.
Terminal window
```
mkdir my-xylit-project
cd my-xylit-project
```
Once you are in your new directory, create your project package.json file. This is how you will manage your project dependencies, including Xylit. If you aren’t familiar with this file format, run the following command to create one.
Terminal window
```
npm init --yes
```
Install Xylit

First, install the Xylit project dependencies inside your project.
Terminal window
```
npm install @xylit/ssg
```
Xylit Projects are ESM only. You have to add the type definition to you package.json:
```
"type": "module",
```
Then, add the following scripts to your package.json:
```
"scripts": {
  "dev": "xylit dev",
  "build": "xylit build",
},
```
You’ll use these scripts later in the guide to start Astro and run its different commands.
Create your first page

In your text editor, create a new file in your directory at index.xylit. This will be your first Xylit page in the project.

For this guide, copy and paste the following code snippet into your new file:
```
export default html`
  <html>
    <body>
      <h1>Hello World </h1>
    </body>
  </html>
`;

style/*css*/`
  h1 { color: azure; }
`;
```
**Create xylit.config.js Xylit is configured using xylit.config.js. This file is optional if you do not need to configure Xylit, but you may wish to create it now.

Create xylit.config.js at the root of your project, and copy the code below into it:
```
export default {};
```
Read Xylits’ configuration reference for more information.
You can now start the Xylit DevServer with npm run dev.