• Stars
    star
    434
  • Rank 100,274 (Top 2 %)
  • Language
    TypeScript
  • Created over 4 years ago
  • Updated 8 months ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Vite + solid templates

Solid Vite Templates

Solid Templates (using vite)

This repository holds most of the official starter templates for vite.

You get:

  • HMR out of the box
  • Minimal bundle size
  • All the vite features

Learn more on the Solid Website and come chat with us on our Discord

Get started

Those templates dependencies are maintained via pnpm via pnpm up -Lri.

This is the reason you see a pnpm-lock.yaml. That being said, any package manager will work. This file can be safely be removed once you clone a template.

These templates are meant to be used as is via the degit utility.

# Javascript template
$ npx degit solidjs/templates/js my-solid-project
$ cd my-solid-project
$ npm install # or pnpm install or yarn install
# Typescript template
$ npx degit solidjs/templates/ts my-solid-project
$ cd my-solid-project
$ npm install # or pnpm install or yarn install
# Typescript minimal template
$ npx degit solidjs/templates/ts-minimal my-solid-project
$ cd my-solid-project
$ npm install # or pnpm install or yarn install
# Typescript unocss template
$ npx degit solidjs/templates/ts-unocss my-solid-project
$ cd my-solid-project
$ npm install # or pnpm install or yarn install
# Typescript tailwindcss template + basic file base routing
$ npx degit solidjs/templates/ts-router my-solid-project
$ cd my-solid-project
$ npm install # or pnpm install or yarn install
# Typescript bootstrap (5) template
$ npx degit solidjs/templates/ts-bootstrap my-solid-project
$ cd my-solid-project
$ npm install # or pnpm install or yarn install
# Typescript + tailwindcss template
$ npx degit solidjs/templates/ts-tailwindcss my-solid-project
$ cd my-solid-project
$ npm install # or pnpm install or yarn install
# Typescript + sass template
$ npx degit solidjs/templates/ts-sass my-solid-project
$ cd my-solid-project
$ npm install # or pnpm install or yarn install
# Javascript + vitest template
$ npx degit solidjs/templates/js-vitest my-solid-project
$ cd my-solid-project
$ npm install # or pnpm install or yarn install
# Typescript + vitest template
$ npx degit solidjs/templates/ts-vitest my-solid-project
$ cd my-solid-project
$ npm install # or pnpm install or yarn install
# Typescript + uvu template
$ npx degit solidjs/templates/ts-uvu my-solid-project
$ cd my-solid-project
$ npm install # or pnpm install or yarn install

I don't see a template that matches my need?

You wish there was a template with your favorite library?

Feel free to make a pull request. Copy one of the template already available, tweak it, name it properly and make a PR. See contributing below.

Contributing

This project is managed with pnpm. You should install it first to test out your template or contribute to an existing one.

You can create your own template and prefix it with ts- or js- and giving it a name that describe the purpose.

To update all dependencies you can run:

pnpm up -Lri

Troubleshooting

It appears that Webstorm generate some weird triggers when saving a file. In order to prevent that you can follow this thread and disable the "Safe Write" option in "Settings | Appearance & Behavior | System Settings".

More Repositories

1

solid

A declarative, efficient, and flexible JavaScript library for building user interfaces.
TypeScript
31,893
star
2

solid-start

SolidStart, the Solid app framework
TypeScript
5,117
star
3

solid-router

A universal router for Solid inspired by Ember and React Router
TypeScript
1,146
star
4

vite-plugin-solid

A simple integration to run solid-js with vite
TypeScript
433
star
5

solid-styled-components

A 1kb Styled Components library for Solid
TypeScript
283
star
6

solid-realworld

A Solid Implementation of the Realworld Example App
JavaScript
228
star
7

solid-docs

SolidJS Docs.
MDX
214
star
8

solid-testing-library

Simple and complete Solid testing utilities that encourage good testing practices.
TypeScript
195
star
9

solid-playground

Quickly discover what the solid compiler will generate from your JSX template
TypeScript
195
star
10

react-solid-state

Auto tracking state management for modern React
TypeScript
188
star
11

solid-site

Code that powers the SolidJS.com platform.
TypeScript
159
star
12

solid-hackernews

Solid implementation of Hacker News
JavaScript
158
star
13

signals

TypeScript
134
star
14

solid-meta

Write meta tags to the document head
TypeScript
127
star
15

solid-refresh

TypeScript
84
star
16

solid-workgroup

Workgroup for future Solid Releases
54
star
17

solid-styled-jsx

A Styled JSX wrapper for Solid
JavaScript
47
star
18

solid-jest

Jest preset for SolidJS
JavaScript
34
star
19

create-solid

Set up a modern web app by running one command
JavaScript
32
star
20

solid-todomvc

Solid implementation of TodoMVC
TypeScript
29
star
21

solidhack-submissions

A repository for collecting SolidHack submissions.
JavaScript
20
star
22

solid-repl

A REPL for SolidJS
TypeScript
14
star
23

solid-service-api

Code that powers Solid Service API on Cloudflare Workers.
JavaScript
13
star
24

solidex

Solidex is a list of SolidJS ecosystem resources and packages.
TypeScript
11
star
25

solid-scripts

No configuration CLI tools to bootstrap Solid applications
JavaScript
10
star
26

solid-assets

Access official dynamic and static assets from SolidJS. Made for the community! 🌟
TypeScript
7
star
27

solid-hot-loader

Webpack Loader with Hot Module Reloading for SolidJS
JavaScript
5
star
28

.github

Community health files for the @solidjs organization
3
star
29

solidhack

Website and contest portal for SolidHack.
TypeScript
2
star