📝 Update README

This commit is contained in:
Alexandre
2021-06-27 21:08:19 +02:00
parent 75a05dcdcd
commit 25d0426ef6
13 changed files with 69 additions and 66 deletions
+29 -24
View File
@@ -1,73 +1,78 @@
# Vite templates for Solid # Solid templates using [vite](https://vitejs.dev/)
This repository holds most of the official starter templates for Vite. This repository holds most of the official starter templates for [vite](https://vitejs.dev/).
You get: You get:
- HMR out of the box - HMR out of the box
- Minimal bundle size - Minimal bundle size
- All the vite features.. - All the vite features
## Install ## Get started
Those templates dependencies are maintained via [pnpm](https://pnpm.js.org/) via `pnpm up -i --latest`. Those templates dependencies are maintained via [pnpm](https://pnpm.js.org/) via `pnpm up -Lri`.
This is the reason you see a `pnpm-lock.yaml`. This is my favorite package manager because it's fast and doesn't bloat the `node_modules` folder.
Note that any package manager should work. I'd just advice you to remove the `pnpm-lock.yml` file before doing an install via your package manager of choice. 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](https://github.com/Rich-Harris/degit) utility.
```bash ```bash
# Javascript template # Javascript template
$ npx degit amoutonbrady/vite-template-solid/js my-solid-project $ npx degit solidjs/templates/js my-solid-project
$ cd my-solid-project $ cd my-solid-project
$ pnpm install # or npm install or yarn install $ npm install # or pnpm install or yarn install
``` ```
```bash ```bash
# Typescript template # Typescript template
$ npx degit amoutonbrady/vite-template-solid/ts my-solid-project $ npx degit solidjs/templates/ts my-solid-project
$ cd my-solid-project $ cd my-solid-project
$ pnpm install # or npm install or yarn install $ npm install # or pnpm install or yarn install
``` ```
```bash ```bash
# Typescript minimal template # Typescript minimal template
$ npx degit amoutonbrady/vite-template-solid/ts-minimal my-solid-project $ npx degit solidjs/templates/ts-minimal my-solid-project
$ cd my-solid-project $ cd my-solid-project
$ pnpm install # or npm install or yarn install $ npm install # or pnpm install or yarn install
``` ```
```bash ```bash
# Typescript tailwind template # Typescript windicss template
$ npx degit amoutonbrady/vite-template-solid/ts-tailwind my-solid-project $ npx degit solidjs/templates/ts-windicss my-solid-project
$ cd my-solid-project $ cd my-solid-project
$ pnpm install # or npm install or yarn install $ npm install # or pnpm install or yarn install
``` ```
```bash ```bash
# Typescript tailwind template + basic file base routing # Typescript windicss template + basic file base routing
$ npx degit amoutonbrady/vite-template-solid/ts-router my-solid-project $ npx degit solidjs/templates/ts-router my-solid-project
$ cd my-solid-project $ cd my-solid-project
$ pnpm install # or npm install or yarn install $ npm install # or pnpm install or yarn install
``` ```
```bash ```bash
# Typescript bootstrap (5) template # Typescript bootstrap (5) template
$ npx degit amoutonbrady/vite-template-solid/ts-bootstrap my-solid-project $ npx degit solidjs/templates/ts-bootstrap my-solid-project
$ cd my-solid-project $ cd my-solid-project
$ pnpm install # or npm install or yarn install $ npm install # or pnpm install or yarn install
``` ```
## I don't see a template that matches my need? ## I don't see a template that matches my need?
You wish there was a template with a router? Bootstrap? Your favorite library? You wish there was a template with your favorite library?
Feel free to make a pull request. Copy on of the template already available, tweak, name it properly and make a PR. Feel free to make a pull request. Copy on of the template already available, tweak it, name it properly and make a PR. See [contributing](#contributing) below.
## Contributing ## Contributing
This project is managed with [pnpm](https://pnpm.js.org/). You should [install it](https://pnpm.js.org/install) 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: To update all dependencies you can run:
`pnpm up -r -L` `pnpm up -Lri`
## Troubleshooting ## Troubleshooting
+4 -5
View File
@@ -1,19 +1,18 @@
## Usage ## Usage
Those templates dependencies are maintained via [pnpm](https://pnpm.js.org/) via `pnpm up -i --latest`. Those templates dependencies are maintained via [pnpm](https://pnpm.js.org/) via `pnpm up -Lri`.
This is the reason you see a `pnpm-lock.yaml`. This is my favorite package manager because it's fast and doesn't bloat the `node_modules` folder.
Note that any package manager should work. I'd just advice you to remove the `pnpm-lock.yml` file before doing an install via your package manager of choice. 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.
```bash ```bash
$ pnpm install # or npm install or yarn install $ npm install # or pnpm install or yarn install
``` ```
## Available Scripts ## Available Scripts
In the project directory, you can run: In the project directory, you can run:
### `npm start` ### `npm dev` or `npm start`
Runs the app in the development mode.<br> Runs the app in the development mode.<br>
Open [http://localhost:3000](http://localhost:3000) to view it in the browser. Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
+3 -2
View File
@@ -1,12 +1,13 @@
{ {
"name": "vite-template-solid", "name": "vite-template-solid",
"version": "0.0.0", "version": "0.0.0",
"description": "My solid + vite project", "description": "",
"scripts": { "scripts": {
"start": "vite", "start": "vite",
"dev": "vite",
"build": "vite build" "build": "vite build"
}, },
"license": "ISC", "license": "MIT",
"devDependencies": { "devDependencies": {
"vite": "^2.3.8", "vite": "^2.3.8",
"vite-plugin-solid": "^2.0.0-rc.4" "vite-plugin-solid": "^2.0.0-rc.4"
+4 -5
View File
@@ -1,19 +1,18 @@
## Usage ## Usage
Those templates dependencies are maintained via [pnpm](https://pnpm.js.org/) via `pnpm up -i --latest`. Those templates dependencies are maintained via [pnpm](https://pnpm.js.org/) via `pnpm up -Lri`.
This is the reason you see a `pnpm-lock.yaml`. This is my favorite package manager because it's fast and doesn't bloat the `node_modules` folder.
Note that any package manager should work. I'd just advice you to remove the `pnpm-lock.yml` file before doing an install via your package manager of choice. 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.
```bash ```bash
$ pnpm install # or npm install or yarn install $ npm install # or pnpm install or yarn install
``` ```
## Available Scripts ## Available Scripts
In the project directory, you can run: In the project directory, you can run:
### `npm run dev` ### `npm dev` or `npm start`
Runs the app in the development mode.<br> Runs the app in the development mode.<br>
Open [http://localhost:3000](http://localhost:3000) to view it in the browser. Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
+2 -2
View File
@@ -1,12 +1,12 @@
{ {
"name": "vite-template-solid", "name": "vite-template-solid",
"version": "0.0.0", "version": "0.0.0",
"description": "My solid + vite project + ts", "description": "",
"scripts": { "scripts": {
"dev": "vite", "dev": "vite",
"build": "vite build" "build": "vite build"
}, },
"license": "ISC", "license": "MIT",
"devDependencies": { "devDependencies": {
"sass": "^1.35.1", "sass": "^1.35.1",
"vite": "^2.3.8", "vite": "^2.3.8",
+5 -5
View File
@@ -1,18 +1,18 @@
## Usage ## Usage
Those templates dependencies are maintained via [pnpm](https://pnpm.js.org/) via `pnpm up -i --latest`. Those templates dependencies are maintained via [pnpm](https://pnpm.js.org/) via `pnpm up -Lri`.
This is the reason you see a `pnpm-lock.yaml`. This is my favorite package manager because it's fast and doesn't bloat the `node_modules` folder.
Note that any package manager should work. I'd just advice you to remove the `pnpm-lock.yml` file before doing an install via your package manager of choice. 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.
```bash ```bash
$ pnpm install # or npm install or yarn install $ npm install # or pnpm install or yarn install
``` ```
## Available Scripts ## Available Scripts
In the project directory, you can run: In the project directory, you can run:
### `npm run dev` ### `npm dev` or `npm start`
Runs the app in the development mode.<br> Runs the app in the development mode.<br>
Open [http://localhost:3000](http://localhost:3000) to view it in the browser. Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
+2 -2
View File
@@ -1,12 +1,12 @@
{ {
"name": "vite-template-solid", "name": "vite-template-solid",
"version": "0.0.0", "version": "0.0.0",
"description": "My solid + vite project + ts", "description": "",
"scripts": { "scripts": {
"dev": "vite", "dev": "vite",
"build": "vite build" "build": "vite build"
}, },
"license": "ISC", "license": "MIT",
"devDependencies": { "devDependencies": {
"vite": "^2.3.8", "vite": "^2.3.8",
"vite-plugin-solid": "^2.0.0-rc.4" "vite-plugin-solid": "^2.0.0-rc.4"
+5 -5
View File
@@ -1,18 +1,18 @@
## Usage ## Usage
Those templates dependencies are maintained via [pnpm](https://pnpm.js.org/) via `pnpm up -i --latest`. Those templates dependencies are maintained via [pnpm](https://pnpm.js.org/) via `pnpm up -Lri`.
This is the reason you see a `pnpm-lock.yaml`. This is my favorite package manager because it's fast and doesn't bloat the `node_modules` folder.
Note that any package manager should work. I'd just advice you to remove the `pnpm-lock.yml` file before doing an install via your package manager of choice. 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.
```bash ```bash
$ pnpm install # or npm install or yarn install $ npm install # or pnpm install or yarn install
``` ```
## Available Scripts ## Available Scripts
In the project directory, you can run: In the project directory, you can run:
### `npm run dev` ### `npm dev` or `npm start`
Runs the app in the development mode.<br> Runs the app in the development mode.<br>
Open [http://localhost:3000](http://localhost:3000) to view it in the browser. Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
+2 -2
View File
@@ -1,12 +1,12 @@
{ {
"name": "vite-template-solid", "name": "vite-template-solid",
"version": "0.0.0", "version": "0.0.0",
"description": "My solid + vite project + ts", "description": "",
"scripts": { "scripts": {
"dev": "vite", "dev": "vite",
"build": "vite build" "build": "vite build"
}, },
"license": "ISC", "license": "MIT",
"devDependencies": { "devDependencies": {
"vite": "^2.3.8", "vite": "^2.3.8",
"vite-plugin-solid": "^2.0.0-rc.4", "vite-plugin-solid": "^2.0.0-rc.4",
+4 -5
View File
@@ -1,19 +1,18 @@
## Usage ## Usage
Those templates dependencies are maintained via [pnpm](https://pnpm.js.org/) via `pnpm up -i --latest`. Those templates dependencies are maintained via [pnpm](https://pnpm.js.org/) via `pnpm up -Lri`.
This is the reason you see a `pnpm-lock.yaml`. This is my favorite package manager because it's fast and doesn't bloat the `node_modules` folder.
Note that any package manager should work. I'd just advice you to remove the `pnpm-lock.yml` file before doing an install via your package manager of choice. 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.
```bash ```bash
$ pnpm install # or npm install or yarn install $ npm install # or pnpm install or yarn install
``` ```
## Available Scripts ## Available Scripts
In the project directory, you can run: In the project directory, you can run:
### `npm run dev` ### `npm dev` or `npm start`
Runs the app in the development mode.<br> Runs the app in the development mode.<br>
Open [http://localhost:3000](http://localhost:3000) to view it in the browser. Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
+2 -2
View File
@@ -1,12 +1,12 @@
{ {
"name": "vite-template-solid", "name": "vite-template-solid",
"version": "0.0.0", "version": "0.0.0",
"description": "My solid + vite project + ts", "description": "",
"scripts": { "scripts": {
"dev": "vite", "dev": "vite",
"build": "vite build" "build": "vite build"
}, },
"license": "ISC", "license": "MIT",
"devDependencies": { "devDependencies": {
"vite": "^2.3.8", "vite": "^2.3.8",
"vite-plugin-solid": "^2.0.0-rc.4", "vite-plugin-solid": "^2.0.0-rc.4",
+4 -5
View File
@@ -1,19 +1,18 @@
## Usage ## Usage
Those templates dependencies are maintained via [pnpm](https://pnpm.js.org/) via `pnpm up -i --latest`. Those templates dependencies are maintained via [pnpm](https://pnpm.js.org/) via `pnpm up -Lri`.
This is the reason you see a `pnpm-lock.yaml`. This is my favorite package manager because it's fast and doesn't bloat the `node_modules` folder.
Note that any package manager should work. I'd just advice you to remove the `pnpm-lock.yml` file before doing an install via your package manager of choice. 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.
```bash ```bash
$ pnpm install # or npm install or yarn install $ npm install # or pnpm install or yarn install
``` ```
## Available Scripts ## Available Scripts
In the project directory, you can run: In the project directory, you can run:
### `npm start` ### `npm dev` or `npm start`
Runs the app in the development mode.<br> Runs the app in the development mode.<br>
Open [http://localhost:3000](http://localhost:3000) to view it in the browser. Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
+3 -2
View File
@@ -1,12 +1,13 @@
{ {
"name": "vite-template-solid", "name": "vite-template-solid",
"version": "0.0.0", "version": "0.0.0",
"description": "My solid + vite project + ts", "description": "",
"scripts": { "scripts": {
"start": "vite", "start": "vite",
"dev": "vite",
"build": "vite build" "build": "vite build"
}, },
"license": "ISC", "license": "MIT",
"devDependencies": { "devDependencies": {
"vite": "^2.3.8", "vite": "^2.3.8",
"vite-plugin-solid": "^2.0.0-rc.4" "vite-plugin-solid": "^2.0.0-rc.4"