talksik/solidjs-templates
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

⬆️ Update to latest dependencies

Browse Source
This commit is contained in:
Alexandre Mouton-Brady
2021-01-23 13:56:41 +01:00
parent 9db0670fcc
commit 2711f753a4
21 changed files with 139 additions and 91 deletions
Download Patch File Download Diff File Expand all files Collapse all files
README.md
+25 -4
View File
@@ -1,33 +1,54 @@
# Vite templates for Solid
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..
## Install
Those templates dependencies are maintained via [pnpm](https://pnpm.js.org/) via `pnpm up -i --latest`.
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.
```bash
# Javascript template
$ npx degit amoutonbrady/vite-template-solid/js my-solid-project
$ cd my-solid-project
$ npm install # or pnpm install or yarn install
$ pnpm install # or npm install or yarn install
```
```bash
# Typescript template
$ npx degit amoutonbrady/vite-template-solid/ts my-solid-project
$ cd my-solid-project
$ npm install # or pnpm install or yarn install
$ pnpm install # or npm install or yarn install
```
```bash
# Typescript minimal template
$ npx degit amoutonbrady/vite-template-solid/ts-minimal my-solid-project
$ cd my-solid-project
$ npm install # or pnpm install or yarn install
$ pnpm install # or npm install or yarn install
```
```bash
# Typescript tailwind template
$ npx degit amoutonbrady/vite-template-solid/ts-tailwind my-solid-project
$ cd my-solid-project
$ npm install # or pnpm install or yarn install
$ pnpm install # or npm install or yarn install
```
## I don't see a template that matches my need?
You wish there was a template with a router? Bootstrap? 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.
## Troubleshooting
It appears that Webstorm generate some weird triggers when saving a file. In order to prevent that you can follow [this thread](https://intellij-support.jetbrains.com/hc/en-us/community/posts/360000154544-I-m-having-a-huge-problem-with-Webstorm-and-react-hot-loader-) and disable the **"Safe Write"** option in **"Settings | Appearance & Behavior | System Settings"**.
js/README.md
+6 -1
View File
@@ -1,7 +1,12 @@
## Usage
Those templates dependencies are maintained via [pnpm](https://pnpm.js.org/) via `pnpm up -i --latest`.
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.
```bash
$ npm install # or pnpm install or yarn install
$ pnpm install # or npm install or yarn install
```
## Available Scripts
js/package.json
+3 -3
View File
@@ -3,13 +3,13 @@
"version": "0.0.0",
"description": "My solid + vite project",
"scripts": {
"dev": "vite",
"start": "vite",
"build": "vite build"
},
"license": "ISC",
"devDependencies": {
"vite": "^2.0.0-beta.33",
"vite-plugin-solid": "^0.6.0"
"vite": "^2.0.0-beta.44",
"vite-plugin-solid": "^0.7.0"
},
"dependencies": {
"solid-js": "^0.23.11"
js/pnpm-lock.yaml
Generated
+15 -15
View File
@@ -1,8 +1,8 @@
dependencies:
solid-js: 0.23.11
devDependencies:
vite: 2.0.0-beta.33
vite-plugin-solid: 0.6.0
vite: 2.0.0-beta.44
vite-plugin-solid: 0.7.0
lockfileVersion: 5.2
packages:
/@babel/code-frame/7.12.11:
@@ -295,12 +295,12 @@ packages:
optional: true
resolution:
integrity: sha512-doEwdvm4PCeK4K3RQN2ZC2BYUBaxwLARCqZmMjtF8a51J2Rb0xpVloFRnCODwqjpwnAoao4pelN8l3RJdv3gRQ==
/esbuild/0.8.33:
/esbuild/0.8.34:
dev: true
hasBin: true
requiresBuild: true
resolution:
integrity: sha512-2ms/P6Y9zJfopR9dKo2vHzhXKfGSNlquVVoVOF8YnhjuzZVrvManMVBPadBsR/t7jzIkRnwqvxrs7d4f3C3eyg==
integrity: sha512-tnr0V1ooakYr1aRLXQLzCn2GVG1kBTW3FWpRyC+NgrR3ntsouVpJOlTOV0BS4YLATx3/c+x3h/uBq9lWJlUAtQ==
/escape-string-regexp/1.0.5:
dev: true
engines:
@@ -413,7 +413,7 @@ packages:
dev: true
resolution:
integrity: sha512-rArEXAgsBG4UgRGcynxWIWKFvh/XZCcS8UJdHhwy91zwAvCZIbcs+vAbflgBnNjYMs/i/i+/Ux6IZhML1yPvxg==
/rollup/2.37.0:
/rollup/2.38.0:
dev: true
engines:
node: '>=10.0.0'
@@ -421,7 +421,7 @@ packages:
optionalDependencies:
fsevents: 2.1.3
resolution:
integrity: sha512-cbxuxkMGCQV+TnVh+yZSUerbVb5i8soRydbzHYoMNojgt7MMi+jDLLs24U9HHCssKkwkXmsj+LXcOZMldTbz2w==
integrity: sha512-ay9zDiNitZK/LNE/EM2+v5CZ7drkB2xyDljvb1fQJCGnq43ZWRkhxN145oV8GmoW1YNi4sA/1Jdkr2LfawJoXw==
/safe-buffer/5.1.2:
dev: true
resolution:
@@ -460,22 +460,22 @@ packages:
node: '>=4'
resolution:
integrity: sha1-3F5pjL0HkmW8c+A3doGk5Og/YW4=
/vite-plugin-solid/0.6.0:
/vite-plugin-solid/0.7.0:
dependencies:
'@babel/core': 7.12.10
'@babel/preset-typescript': 7.12.7_@babel+core@7.12.10
babel-preset-solid: 0.23.8_@babel+core@7.12.10
solid-js: 0.23.11
vite: 2.0.0-beta.33
vite: 2.0.0-beta.44
dev: true
resolution:
integrity: sha512-nGF87Mh6g5ZKsmausJRRl1MQRduv2T/v57JZQVYPAtLhIboVE62BtfXBkVNKHBhU7WoKM+0wCm5bt34uEJwrRw==
/vite/2.0.0-beta.33:
integrity: sha512-gU0xb5zFpjIZiCvPpyir5fSBDIUPC2S32NYdJ9x8pbA/W0J/bzfB5yw2DTa7ZQoFXfnkNWZsEdsjkGXhw0aHTw==
/vite/2.0.0-beta.44:
dependencies:
esbuild: 0.8.33
esbuild: 0.8.34
postcss: 8.2.4
resolve: 1.19.0
rollup: 2.37.0
rollup: 2.38.0
dev: true
engines:
node: '>=12.0.0'
@@ -483,8 +483,8 @@ packages:
optionalDependencies:
fsevents: 2.1.3
resolution:
integrity: sha512-vg7rZbO19w1+nkV3fXsk0ggfI7J8DBDm74olVKgN7/SarrlisOZI/YWwP4XybGVNPnsSsOG9pKXhXl1mY6Oe5A==
integrity: sha512-NTzmP7HEKDg3J5r3I22f87jK3ugPVEU81BQ8hWn3hNWU0msCziUlj7aHwItSUEbQA+ymqO3TBO2fN7Aa+OKckQ==
specifiers:
solid-js: ^0.23.11
vite: ^2.0.0-beta.33
vite-plugin-solid: ^0.6.0
vite: ^2.0.0-beta.44
vite-plugin-solid: ^0.7.0
js/src/App.jsx
+5 -5
View File
@@ -1,16 +1,16 @@
import logo from "./logo.svg";
import "./App.css";
import styles from "./App.module.css";
function App() {
return (
<div class="App">
<header class="App-header">
<img src={logo} class="App-logo" alt="logo" />
<div class={styles.App}>
<header class={styles.header}>
<img src={logo} class={styles.logo} alt="logo" />
<p>
Edit <code>src/App.js</code> and save to reload.
</p>
<a
class="App-link"
class={styles.link}
href="https://github.com/ryansolid/solid"
target="_blank"
rel="noopener noreferrer"
js/src/App.css → js/src/App.module.css
+5 -5
View File
@@ -2,13 +2,13 @@
text-align: center;
}
.App-logo {
animation: App-logo-spin infinite 20s linear;
.logo {
animation: logo-spin infinite 20s linear;
height: 40vmin;
pointer-events: none;
}
.App-header {
.header {
background-color: #282c34;
min-height: 100vh;
display: flex;
@@ -19,11 +19,11 @@
color: white;
}
.App-link {
.link {
color: #b318f0;
}
@keyframes App-logo-spin {
@keyframes logo-spin {
from {
transform: rotate(0deg);
}
js/src/index.jsx
+3 -3
View File
@@ -1,4 +1,4 @@
import { render } from "solid-js/dom";
import { render } from "solid-js/web";
import "./index.css";
import App from "./App";
@@ -6,6 +6,6 @@ import App from "./App";
const dispose = render(App, document.getElementById("root"));
if (import.meta.hot) {
import.meta.hot.accept()
import.meta.hot.dispose(dispose)
import.meta.hot.accept();
import.meta.hot.dispose(dispose);
}
js/vite.config.js
+4
View File
@@ -3,4 +3,8 @@ import solidPlugin from "vite-plugin-solid";
export default defineConfig({
plugins: [solidPlugin()],
build: {
target: "esnext",
polyfillDynamicImport: false,
},
});
ts-minimal/README.md
+8 -4
View File
@@ -1,14 +1,18 @@
## Usage
```bash
$ npm install # or pnpm install or yarn install
```
Those templates dependencies are maintained via [pnpm](https://pnpm.js.org/) via `pnpm up -i --latest`.
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.
```bash
$ pnpm install # or npm install or yarn install
```
## Available Scripts
In the project directory, you can run:
### `npm start`
### `npm run dev`
Runs the app in the development mode.<br>
Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
ts-minimal/package.json
+2 -2
View File
@@ -8,8 +8,8 @@
},
"license": "ISC",
"devDependencies": {
"vite": "^2.0.0-beta.33",
"vite-plugin-solid": "^0.6.0"
"vite": "^2.0.0-beta.44",
"vite-plugin-solid": "^0.7.0"
},
"dependencies": {
"solid-js": "^0.23.11"
ts-minimal/pnpm-lock.yaml
Generated
+15 -15
View File
@@ -1,8 +1,8 @@
dependencies:
solid-js: 0.23.11
devDependencies:
vite: 2.0.0-beta.33
vite-plugin-solid: 0.6.0
vite: 2.0.0-beta.44
vite-plugin-solid: 0.7.0
lockfileVersion: 5.2
packages:
/@babel/code-frame/7.12.11:
@@ -295,12 +295,12 @@ packages:
optional: true
resolution:
integrity: sha512-doEwdvm4PCeK4K3RQN2ZC2BYUBaxwLARCqZmMjtF8a51J2Rb0xpVloFRnCODwqjpwnAoao4pelN8l3RJdv3gRQ==
/esbuild/0.8.33:
/esbuild/0.8.34:
dev: true
hasBin: true
requiresBuild: true
resolution:
integrity: sha512-2ms/P6Y9zJfopR9dKo2vHzhXKfGSNlquVVoVOF8YnhjuzZVrvManMVBPadBsR/t7jzIkRnwqvxrs7d4f3C3eyg==
integrity: sha512-tnr0V1ooakYr1aRLXQLzCn2GVG1kBTW3FWpRyC+NgrR3ntsouVpJOlTOV0BS4YLATx3/c+x3h/uBq9lWJlUAtQ==
/escape-string-regexp/1.0.5:
dev: true
engines:
@@ -413,7 +413,7 @@ packages:
dev: true
resolution:
integrity: sha512-rArEXAgsBG4UgRGcynxWIWKFvh/XZCcS8UJdHhwy91zwAvCZIbcs+vAbflgBnNjYMs/i/i+/Ux6IZhML1yPvxg==
/rollup/2.37.0:
/rollup/2.38.0:
dev: true
engines:
node: '>=10.0.0'
@@ -421,7 +421,7 @@ packages:
optionalDependencies:
fsevents: 2.1.3
resolution:
integrity: sha512-cbxuxkMGCQV+TnVh+yZSUerbVb5i8soRydbzHYoMNojgt7MMi+jDLLs24U9HHCssKkwkXmsj+LXcOZMldTbz2w==
integrity: sha512-ay9zDiNitZK/LNE/EM2+v5CZ7drkB2xyDljvb1fQJCGnq43ZWRkhxN145oV8GmoW1YNi4sA/1Jdkr2LfawJoXw==
/safe-buffer/5.1.2:
dev: true
resolution:
@@ -460,22 +460,22 @@ packages:
node: '>=4'
resolution:
integrity: sha1-3F5pjL0HkmW8c+A3doGk5Og/YW4=
/vite-plugin-solid/0.6.0:
/vite-plugin-solid/0.7.0:
dependencies:
'@babel/core': 7.12.10
'@babel/preset-typescript': 7.12.7_@babel+core@7.12.10
babel-preset-solid: 0.23.8_@babel+core@7.12.10
solid-js: 0.23.11
vite: 2.0.0-beta.33
vite: 2.0.0-beta.44
dev: true
resolution:
integrity: sha512-nGF87Mh6g5ZKsmausJRRl1MQRduv2T/v57JZQVYPAtLhIboVE62BtfXBkVNKHBhU7WoKM+0wCm5bt34uEJwrRw==
/vite/2.0.0-beta.33:
integrity: sha512-gU0xb5zFpjIZiCvPpyir5fSBDIUPC2S32NYdJ9x8pbA/W0J/bzfB5yw2DTa7ZQoFXfnkNWZsEdsjkGXhw0aHTw==
/vite/2.0.0-beta.44:
dependencies:
esbuild: 0.8.33
esbuild: 0.8.34
postcss: 8.2.4
resolve: 1.19.0
rollup: 2.37.0
rollup: 2.38.0
dev: true
engines:
node: '>=12.0.0'
@@ -483,8 +483,8 @@ packages:
optionalDependencies:
fsevents: 2.1.3
resolution:
integrity: sha512-vg7rZbO19w1+nkV3fXsk0ggfI7J8DBDm74olVKgN7/SarrlisOZI/YWwP4XybGVNPnsSsOG9pKXhXl1mY6Oe5A==
integrity: sha512-NTzmP7HEKDg3J5r3I22f87jK3ugPVEU81BQ8hWn3hNWU0msCziUlj7aHwItSUEbQA+ymqO3TBO2fN7Aa+OKckQ==
specifiers:
solid-js: ^0.23.11
vite: ^2.0.0-beta.33
vite-plugin-solid: ^0.6.0
vite: ^2.0.0-beta.44
vite-plugin-solid: ^0.7.0
ts-minimal/src/App.tsx
+2 -2
View File
@@ -1,7 +1,7 @@
import { Component } from "solid-js";
import type { Component } from "solid-js";
const App: Component = () => {
return <p>minimal</p>;
return <h1>Hello world!</h1>;
};
export default App;
ts-minimal/src/index.tsx
+1 -1
View File
@@ -1,4 +1,4 @@
import { render } from "solid-js/dom";
import { render } from "solid-js/web";
import App from "./App";
ts-minimal/vite.config.ts
+4
View File
@@ -3,4 +3,8 @@ import solidPlugin from "vite-plugin-solid";
export default defineConfig({
plugins: [solidPlugin()],
build: {
target: "esnext",
polyfillDynamicImport: false,
},
});
ts/README.md
+6 -1
View File
@@ -1,7 +1,12 @@
## Usage
Those templates dependencies are maintained via [pnpm](https://pnpm.js.org/) via `pnpm up -i --latest`.
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.
```bash
$ npm install # or pnpm install or yarn install
$ pnpm install # or npm install or yarn install
```
## Available Scripts
ts/package.json
+3 -3
View File
@@ -3,13 +3,13 @@
"version": "0.0.0",
"description": "My solid + vite project + ts",
"scripts": {
"dev": "vite",
"start": "vite",
"build": "vite build"
},
"license": "ISC",
"devDependencies": {
"vite": "^2.0.0-beta.33",
"vite-plugin-solid": "^0.6.0"
"vite": "^2.0.0-beta.44",
"vite-plugin-solid": "^0.7.0"
},
"dependencies": {
"solid-js": "^0.23.11"
ts/pnpm-lock.yaml
Generated
+15 -15
View File
@@ -1,8 +1,8 @@
dependencies:
solid-js: 0.23.11
devDependencies:
vite: 2.0.0-beta.33
vite-plugin-solid: 0.6.0
vite: 2.0.0-beta.44
vite-plugin-solid: 0.7.0
lockfileVersion: 5.2
packages:
/@babel/code-frame/7.12.11:
@@ -295,12 +295,12 @@ packages:
optional: true
resolution:
integrity: sha512-doEwdvm4PCeK4K3RQN2ZC2BYUBaxwLARCqZmMjtF8a51J2Rb0xpVloFRnCODwqjpwnAoao4pelN8l3RJdv3gRQ==
/esbuild/0.8.33:
/esbuild/0.8.34:
dev: true
hasBin: true
requiresBuild: true
resolution:
integrity: sha512-2ms/P6Y9zJfopR9dKo2vHzhXKfGSNlquVVoVOF8YnhjuzZVrvManMVBPadBsR/t7jzIkRnwqvxrs7d4f3C3eyg==
integrity: sha512-tnr0V1ooakYr1aRLXQLzCn2GVG1kBTW3FWpRyC+NgrR3ntsouVpJOlTOV0BS4YLATx3/c+x3h/uBq9lWJlUAtQ==
/escape-string-regexp/1.0.5:
dev: true
engines:
@@ -413,7 +413,7 @@ packages:
dev: true
resolution:
integrity: sha512-rArEXAgsBG4UgRGcynxWIWKFvh/XZCcS8UJdHhwy91zwAvCZIbcs+vAbflgBnNjYMs/i/i+/Ux6IZhML1yPvxg==
/rollup/2.37.0:
/rollup/2.38.0:
dev: true
engines:
node: '>=10.0.0'
@@ -421,7 +421,7 @@ packages:
optionalDependencies:
fsevents: 2.1.3
resolution:
integrity: sha512-cbxuxkMGCQV+TnVh+yZSUerbVb5i8soRydbzHYoMNojgt7MMi+jDLLs24U9HHCssKkwkXmsj+LXcOZMldTbz2w==
integrity: sha512-ay9zDiNitZK/LNE/EM2+v5CZ7drkB2xyDljvb1fQJCGnq43ZWRkhxN145oV8GmoW1YNi4sA/1Jdkr2LfawJoXw==
/safe-buffer/5.1.2:
dev: true
resolution:
@@ -460,22 +460,22 @@ packages:
node: '>=4'
resolution:
integrity: sha1-3F5pjL0HkmW8c+A3doGk5Og/YW4=
/vite-plugin-solid/0.6.0:
/vite-plugin-solid/0.7.0:
dependencies:
'@babel/core': 7.12.10
'@babel/preset-typescript': 7.12.7_@babel+core@7.12.10
babel-preset-solid: 0.23.8_@babel+core@7.12.10
solid-js: 0.23.11
vite: 2.0.0-beta.33
vite: 2.0.0-beta.44
dev: true
resolution:
integrity: sha512-nGF87Mh6g5ZKsmausJRRl1MQRduv2T/v57JZQVYPAtLhIboVE62BtfXBkVNKHBhU7WoKM+0wCm5bt34uEJwrRw==
/vite/2.0.0-beta.33:
integrity: sha512-gU0xb5zFpjIZiCvPpyir5fSBDIUPC2S32NYdJ9x8pbA/W0J/bzfB5yw2DTa7ZQoFXfnkNWZsEdsjkGXhw0aHTw==
/vite/2.0.0-beta.44:
dependencies:
esbuild: 0.8.33
esbuild: 0.8.34
postcss: 8.2.4
resolve: 1.19.0
rollup: 2.37.0
rollup: 2.38.0
dev: true
engines:
node: '>=12.0.0'
@@ -483,8 +483,8 @@ packages:
optionalDependencies:
fsevents: 2.1.3
resolution:
integrity: sha512-vg7rZbO19w1+nkV3fXsk0ggfI7J8DBDm74olVKgN7/SarrlisOZI/YWwP4XybGVNPnsSsOG9pKXhXl1mY6Oe5A==
integrity: sha512-NTzmP7HEKDg3J5r3I22f87jK3ugPVEU81BQ8hWn3hNWU0msCziUlj7aHwItSUEbQA+ymqO3TBO2fN7Aa+OKckQ==
specifiers:
solid-js: ^0.23.11
vite: ^2.0.0-beta.33
vite-plugin-solid: ^0.6.0
vite: ^2.0.0-beta.44
vite-plugin-solid: ^0.7.0
ts/src/App.css → ts/src/App.module.css
+5 -5
View File
@@ -2,13 +2,13 @@
text-align: center;
}
.App-logo {
animation: App-logo-spin infinite 20s linear;
.logo {
animation: logo-spin infinite 20s linear;
height: 40vmin;
pointer-events: none;
}
.App-header {
.header {
background-color: #282c34;
min-height: 100vh;
display: flex;
@@ -19,11 +19,11 @@
color: white;
}
.App-link {
.link {
color: #b318f0;
}
@keyframes App-logo-spin {
@keyframes logo-spin {
from {
transform: rotate(0deg);
}
ts/src/App.tsx
+7 -6
View File
@@ -1,17 +1,18 @@
import type { Component } from "solid-js";
import logo from "./logo.svg";
import "./App.css";
import { Component } from "solid-js";
import styles from "./App.module.css";
const App: Component = () => {
return (
<div class="App">
<header class="App-header">
<img src={logo} class="App-logo" alt="logo" />
<div class={styles.App}>
<header class={styles.header}>
<img src={logo} class={styles.logo} alt="logo" />
<p>
Edit <code>src/App.tsx</code> and save to reload.
</p>
<a
class="App-link"
class={styles.link}
href="https://github.com/ryansolid/solid"
target="_blank"
rel="noopener noreferrer"
ts/src/index.tsx
+1 -1
View File
@@ -1,4 +1,4 @@
import { render } from "solid-js/dom";
import { render } from "solid-js/web";
import "./index.css";
import App from "./App";
ts/vite.config.ts
+4
View File
@@ -3,4 +3,8 @@ import solidPlugin from "vite-plugin-solid";
export default defineConfig({
plugins: [solidPlugin()],
build: {
target: "esnext",
polyfillDynamicImport: false,
},
});