• Stars
    star
    408
  • Rank 102,541 (Top 3 %)
  • Language
    TypeScript
  • Created almost 4 years ago
  • Updated 3 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
30,592
star
2

solid-start

SolidStart, the Solid app framework
HTML
4,465
star
3

solid-router

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

vite-plugin-solid

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

solid-styled-components

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

solid-realworld

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

solid-testing-library

Simple and complete Solid testing utilities that encourage good testing practices.
TypeScript
187
star
8

react-solid-state

Auto tracking state management for modern React
TypeScript
185
star
9

solid-docs-next

SolidJS Core Docs.
MDX
182
star
10

solid-docs

Cumulative documentation for SolidJS and related packages.
TypeScript
182
star
11

solid-playground

Quickly discover what the solid compiler will generate from your JSX template
TypeScript
173
star
12

solid-site

Code that powers the SolidJS.com platform.
TypeScript
156
star
13

solid-hackernews

Solid implementation of Hacker News
JavaScript
152
star
14

signals

TypeScript
128
star
15

solid-meta

Write meta tags to the document head
TypeScript
101
star
16

solid-refresh

TypeScript
77
star
17

solid-workgroup

Workgroup for future Solid Releases
53
star
18

solid-styled-jsx

A Styled JSX wrapper for Solid
JavaScript
40
star
19

solid-jest

Jest preset for SolidJS
JavaScript
33
star
20

create-solid

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

solid-todomvc

Solid implementation of TodoMVC
TypeScript
29
star
22

solidhack-submissions

A repository for collecting SolidHack submissions.
JavaScript
20
star
23

solid-repl

A REPL for SolidJS
TypeScript
14
star
24

solid-service-api

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

solidex

Solidex is a list of SolidJS ecosystem resources and packages.
TypeScript
10
star
26

solid-scripts

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

solid-assets

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

solid-hot-loader

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

.github

Community health files for the @solidjs organization
3
star
30

solidhack

Website and contest portal for SolidHack.
TypeScript
2
star