create-vite-extra 0.0.2 → 0.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +10 -0
- package/index.js +35 -22
- package/package.json +3 -3
- package/template-deno-vue/README.md +41 -0
- package/template-deno-vue/deno.json +8 -0
- package/template-deno-vue/index.html +13 -0
- package/template-deno-vue/public/vite.svg +1 -0
- package/template-deno-vue/src/App.vue +31 -0
- package/template-deno-vue/src/assets/vue.svg +1 -0
- package/template-deno-vue/src/components/HelloWorld.vue +40 -0
- package/template-deno-vue/src/main.js +5 -0
- package/template-deno-vue/src/style.css +90 -0
- package/template-deno-vue/vite.config.mjs +10 -0
- package/template-library/package.json +5 -2
- package/template-library-ts/package.json +6 -3
- package/template-ssr-preact/package.json +4 -4
- package/template-ssr-preact-ts/package.json +6 -6
- package/template-ssr-preact-ts/tsconfig.json +2 -3
- package/template-ssr-react/package.json +3 -3
- package/template-ssr-react-ts/package.json +4 -4
- package/template-ssr-svelte/README.md +0 -1
- package/template-ssr-svelte/jsconfig.json +0 -1
- package/template-ssr-svelte/package.json +3 -3
- package/template-ssr-svelte-ts/README.md +0 -1
- package/template-ssr-svelte-ts/package.json +5 -5
- package/template-ssr-svelte-ts/tsconfig.json +0 -1
- package/template-ssr-transform/package.json +1 -1
- package/template-ssr-vanilla/package.json +1 -1
- package/template-ssr-vanilla/src/counter.js +1 -1
- package/template-ssr-vanilla-ts/package.json +4 -4
- package/template-ssr-vanilla-ts/src/counter.ts +1 -1
- package/template-ssr-vanilla-ts/tsconfig.json +0 -1
- package/template-ssr-vue/package.json +3 -3
- package/template-ssr-vue-ts/package.json +5 -5
- package/template-ssr-vue-ts/tsconfig.json +2 -2
- package/template-ssr-preact-ts/src/preact.d.ts +0 -1
package/README.md
CHANGED
|
@@ -23,6 +23,12 @@ With PNPM:
|
|
|
23
23
|
$ pnpm create vite-extra
|
|
24
24
|
```
|
|
25
25
|
|
|
26
|
+
With Deno:
|
|
27
|
+
|
|
28
|
+
```bash
|
|
29
|
+
$ deno run -A --unstable npm:create-vite-extra
|
|
30
|
+
```
|
|
31
|
+
|
|
26
32
|
Then follow the prompts!
|
|
27
33
|
|
|
28
34
|
You can also directly specify the project name and the template you want to use via additional command line options. For example, to scaffold a Vite + SSR + Vue project, run:
|
|
@@ -36,6 +42,9 @@ yarn create vite-extra my-vue-app --template ssr-vue
|
|
|
36
42
|
|
|
37
43
|
# pnpm
|
|
38
44
|
pnpm create vite-extra my-vue-app --template ssr-vue
|
|
45
|
+
|
|
46
|
+
# Deno
|
|
47
|
+
deno run -A --unstable npm:create-vite-extra --template deno-vue
|
|
39
48
|
```
|
|
40
49
|
|
|
41
50
|
Currently supported template presets include:
|
|
@@ -53,6 +62,7 @@ Currently supported template presets include:
|
|
|
53
62
|
- `ssr-transform`
|
|
54
63
|
- `library`
|
|
55
64
|
- `library-ts`
|
|
65
|
+
- `deno-vue`
|
|
56
66
|
|
|
57
67
|
You can use `.` for the project name to scaffold in the current directory.
|
|
58
68
|
|
package/index.js
CHANGED
|
@@ -104,7 +104,6 @@ const FRAMEWORKS = [
|
|
|
104
104
|
}
|
|
105
105
|
]
|
|
106
106
|
},
|
|
107
|
-
|
|
108
107
|
{
|
|
109
108
|
name: 'ssr-transform',
|
|
110
109
|
color: lightRed
|
|
@@ -124,6 +123,10 @@ const FRAMEWORKS = [
|
|
|
124
123
|
color: blue
|
|
125
124
|
}
|
|
126
125
|
]
|
|
126
|
+
},
|
|
127
|
+
{
|
|
128
|
+
name: 'deno-vue',
|
|
129
|
+
color: green
|
|
127
130
|
}
|
|
128
131
|
]
|
|
129
132
|
|
|
@@ -267,32 +270,42 @@ async function init() {
|
|
|
267
270
|
write(file)
|
|
268
271
|
}
|
|
269
272
|
|
|
270
|
-
const
|
|
271
|
-
|
|
272
|
-
|
|
273
|
+
const isDeno = template.startsWith('deno-')
|
|
274
|
+
if (isDeno) {
|
|
275
|
+
console.log(`\nDone. Now run:\n`)
|
|
276
|
+
if (root !== cwd) {
|
|
277
|
+
console.log(` cd ${path.relative(cwd, root)}`)
|
|
278
|
+
}
|
|
279
|
+
console.log(' deno task dev')
|
|
280
|
+
console.log()
|
|
281
|
+
} else {
|
|
282
|
+
const pkg = JSON.parse(
|
|
283
|
+
fs.readFileSync(path.join(templateDir, `package.json`), 'utf-8')
|
|
284
|
+
)
|
|
273
285
|
|
|
274
|
-
|
|
286
|
+
pkg.name = packageName || getProjectName()
|
|
275
287
|
|
|
276
|
-
|
|
288
|
+
write('package.json', JSON.stringify(pkg, null, 2))
|
|
277
289
|
|
|
278
|
-
|
|
279
|
-
|
|
290
|
+
const pkgInfo = pkgFromUserAgent(process.env.npm_config_user_agent)
|
|
291
|
+
const pkgManager = pkgInfo ? pkgInfo.name : 'npm'
|
|
280
292
|
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
293
|
+
console.log(`\nDone. Now run:\n`)
|
|
294
|
+
if (root !== cwd) {
|
|
295
|
+
console.log(` cd ${path.relative(cwd, root)}`)
|
|
296
|
+
}
|
|
297
|
+
switch (pkgManager) {
|
|
298
|
+
case 'yarn':
|
|
299
|
+
console.log(' yarn')
|
|
300
|
+
console.log(' yarn dev')
|
|
301
|
+
break
|
|
302
|
+
default:
|
|
303
|
+
console.log(` ${pkgManager} install`)
|
|
304
|
+
console.log(` ${pkgManager} run dev`)
|
|
305
|
+
break
|
|
306
|
+
}
|
|
307
|
+
console.log()
|
|
294
308
|
}
|
|
295
|
-
console.log()
|
|
296
309
|
}
|
|
297
310
|
|
|
298
311
|
/**
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "create-vite-extra",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.1.1",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"author": "Bjorn Lu",
|
|
@@ -27,8 +27,8 @@
|
|
|
27
27
|
},
|
|
28
28
|
"homepage": "https://github.com/bluwy/create-vite-extra#readme",
|
|
29
29
|
"dependencies": {
|
|
30
|
-
"kolorist": "^1.
|
|
30
|
+
"kolorist": "^1.6.0",
|
|
31
31
|
"minimist": "^1.2.6",
|
|
32
32
|
"prompts": "^2.4.2"
|
|
33
33
|
}
|
|
34
|
-
}
|
|
34
|
+
}
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
# Vite + Deno
|
|
2
|
+
|
|
3
|
+
This is an example repo of running Vite with Deno.
|
|
4
|
+
|
|
5
|
+
You can see live site at: https://vite-deno-example.deno.dev
|
|
6
|
+
|
|
7
|
+
This repo is based on `vue` template for Vite:
|
|
8
|
+
https://stackblitz.com/edit/vitejs-vite-ifm7jc?file=index.html&terminal=dev
|
|
9
|
+
|
|
10
|
+
## Notes
|
|
11
|
+
|
|
12
|
+
- You need to use `.mjs` or `.mts` extension for the `vite.config.[ext]` file.
|
|
13
|
+
|
|
14
|
+
## Papercuts
|
|
15
|
+
|
|
16
|
+
Currently there's a "papercut" for Deno users:
|
|
17
|
+
|
|
18
|
+
- peer dependencies need to be referenced in `vite.config.js` - in this example
|
|
19
|
+
it is only `vue` package that needs to be referenced
|
|
20
|
+
|
|
21
|
+
## Running
|
|
22
|
+
|
|
23
|
+
You need to have Deno v1.25.4 or later intalled to run this repo.
|
|
24
|
+
|
|
25
|
+
Start a dev server:
|
|
26
|
+
|
|
27
|
+
```
|
|
28
|
+
$ deno task dev
|
|
29
|
+
```
|
|
30
|
+
|
|
31
|
+
## Deploy
|
|
32
|
+
|
|
33
|
+
Build production assets:
|
|
34
|
+
|
|
35
|
+
```
|
|
36
|
+
$ deno task build
|
|
37
|
+
```
|
|
38
|
+
|
|
39
|
+
This repository uses
|
|
40
|
+
[Deno Deploy and Git integration](https://deno.com/deploy/docs/projects#git-integration),
|
|
41
|
+
where deployment is happening as part of the CI pipeline.
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
{
|
|
2
|
+
"tasks": {
|
|
3
|
+
"dev": "deno run -A --unstable --node-modules-dir npm:vite",
|
|
4
|
+
"build": "deno run -A --unstable --node-modules-dir npm:vite build",
|
|
5
|
+
"preview": "deno run -A --unstable --node-modules-dir npm:vite preview",
|
|
6
|
+
"serve": "deno run --allow-net --allow-read main.ts"
|
|
7
|
+
}
|
|
8
|
+
}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8" />
|
|
5
|
+
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
|
|
6
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
7
|
+
<title>Vite + Vue</title>
|
|
8
|
+
</head>
|
|
9
|
+
<body>
|
|
10
|
+
<div id="app"></div>
|
|
11
|
+
<script type="module" src="/src/main.js"></script>
|
|
12
|
+
</body>
|
|
13
|
+
</html>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
<script setup>
|
|
2
|
+
// This starter template is using Vue 3 <script setup> SFCs
|
|
3
|
+
// Check out https://vuejs.org/api/sfc-script-setup.html#script-setup
|
|
4
|
+
import HelloWorld from './components/HelloWorld.vue'
|
|
5
|
+
</script>
|
|
6
|
+
|
|
7
|
+
<template>
|
|
8
|
+
<div>
|
|
9
|
+
<a href="https://vitejs.dev" target="_blank">
|
|
10
|
+
<img src="/vite.svg" class="logo" alt="Vite logo" />
|
|
11
|
+
</a>
|
|
12
|
+
<a href="https://vuejs.org/" target="_blank">
|
|
13
|
+
<img src="./assets/vue.svg" class="logo vue" alt="Vue logo" />
|
|
14
|
+
</a>
|
|
15
|
+
</div>
|
|
16
|
+
<HelloWorld msg="Vite + Vue" />
|
|
17
|
+
</template>
|
|
18
|
+
|
|
19
|
+
<style scoped>
|
|
20
|
+
.logo {
|
|
21
|
+
height: 6em;
|
|
22
|
+
padding: 1.5em;
|
|
23
|
+
will-change: filter;
|
|
24
|
+
}
|
|
25
|
+
.logo:hover {
|
|
26
|
+
filter: drop-shadow(0 0 2em #646cffaa);
|
|
27
|
+
}
|
|
28
|
+
.logo.vue:hover {
|
|
29
|
+
filter: drop-shadow(0 0 2em #42b883aa);
|
|
30
|
+
}
|
|
31
|
+
</style>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="37.07" height="36" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 198"><path fill="#41B883" d="M204.8 0H256L128 220.8L0 0h97.92L128 51.2L157.44 0h47.36Z"></path><path fill="#41B883" d="m0 0l128 220.8L256 0h-51.2L128 132.48L50.56 0H0Z"></path><path fill="#35495E" d="M50.56 0L128 133.12L204.8 0h-47.36L128 51.2L97.92 0H50.56Z"></path></svg>
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
<script setup>
|
|
2
|
+
import { ref } from 'vue'
|
|
3
|
+
|
|
4
|
+
defineProps({
|
|
5
|
+
msg: String
|
|
6
|
+
})
|
|
7
|
+
|
|
8
|
+
const count = ref(0)
|
|
9
|
+
</script>
|
|
10
|
+
|
|
11
|
+
<template>
|
|
12
|
+
<h1>{{ msg }}</h1>
|
|
13
|
+
|
|
14
|
+
<div class="card">
|
|
15
|
+
<button type="button" @click="count++">count is {{ count }}</button>
|
|
16
|
+
<p>
|
|
17
|
+
Edit
|
|
18
|
+
<code>components/HelloWorld.vue</code> to test HMR
|
|
19
|
+
</p>
|
|
20
|
+
</div>
|
|
21
|
+
|
|
22
|
+
<p>
|
|
23
|
+
Check out
|
|
24
|
+
<a href="https://vuejs.org/guide/quick-start.html#local" target="_blank"
|
|
25
|
+
>create-vue</a
|
|
26
|
+
>, the official Vue + Vite starter
|
|
27
|
+
</p>
|
|
28
|
+
<p>
|
|
29
|
+
Install
|
|
30
|
+
<a href="https://github.com/johnsoncodehk/volar" target="_blank">Volar</a>
|
|
31
|
+
in your IDE for a better DX
|
|
32
|
+
</p>
|
|
33
|
+
<p class="read-the-docs">Click on the Vite and Vue logos to learn more</p>
|
|
34
|
+
</template>
|
|
35
|
+
|
|
36
|
+
<style scoped>
|
|
37
|
+
.read-the-docs {
|
|
38
|
+
color: #888;
|
|
39
|
+
}
|
|
40
|
+
</style>
|
|
@@ -0,0 +1,90 @@
|
|
|
1
|
+
:root {
|
|
2
|
+
font-family: Inter, Avenir, Helvetica, Arial, sans-serif;
|
|
3
|
+
font-size: 16px;
|
|
4
|
+
line-height: 24px;
|
|
5
|
+
font-weight: 400;
|
|
6
|
+
|
|
7
|
+
color-scheme: light dark;
|
|
8
|
+
color: rgba(255, 255, 255, 0.87);
|
|
9
|
+
background-color: #242424;
|
|
10
|
+
|
|
11
|
+
font-synthesis: none;
|
|
12
|
+
text-rendering: optimizeLegibility;
|
|
13
|
+
-webkit-font-smoothing: antialiased;
|
|
14
|
+
-moz-osx-font-smoothing: grayscale;
|
|
15
|
+
-webkit-text-size-adjust: 100%;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
a {
|
|
19
|
+
font-weight: 500;
|
|
20
|
+
color: #646cff;
|
|
21
|
+
text-decoration: inherit;
|
|
22
|
+
}
|
|
23
|
+
a:hover {
|
|
24
|
+
color: #535bf2;
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
a {
|
|
28
|
+
font-weight: 500;
|
|
29
|
+
color: #646cff;
|
|
30
|
+
text-decoration: inherit;
|
|
31
|
+
}
|
|
32
|
+
a:hover {
|
|
33
|
+
color: #535bf2;
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
body {
|
|
37
|
+
margin: 0;
|
|
38
|
+
display: flex;
|
|
39
|
+
place-items: center;
|
|
40
|
+
min-width: 320px;
|
|
41
|
+
min-height: 100vh;
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
h1 {
|
|
45
|
+
font-size: 3.2em;
|
|
46
|
+
line-height: 1.1;
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
button {
|
|
50
|
+
border-radius: 8px;
|
|
51
|
+
border: 1px solid transparent;
|
|
52
|
+
padding: 0.6em 1.2em;
|
|
53
|
+
font-size: 1em;
|
|
54
|
+
font-weight: 500;
|
|
55
|
+
font-family: inherit;
|
|
56
|
+
background-color: #1a1a1a;
|
|
57
|
+
cursor: pointer;
|
|
58
|
+
transition: border-color 0.25s;
|
|
59
|
+
}
|
|
60
|
+
button:hover {
|
|
61
|
+
border-color: #646cff;
|
|
62
|
+
}
|
|
63
|
+
button:focus,
|
|
64
|
+
button:focus-visible {
|
|
65
|
+
outline: 4px auto -webkit-focus-ring-color;
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
.card {
|
|
69
|
+
padding: 2em;
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
#app {
|
|
73
|
+
max-width: 1280px;
|
|
74
|
+
margin: 0 auto;
|
|
75
|
+
padding: 2rem;
|
|
76
|
+
text-align: center;
|
|
77
|
+
}
|
|
78
|
+
|
|
79
|
+
@media (prefers-color-scheme: light) {
|
|
80
|
+
:root {
|
|
81
|
+
color: #213547;
|
|
82
|
+
background-color: #ffffff;
|
|
83
|
+
}
|
|
84
|
+
a:hover {
|
|
85
|
+
color: #747bff;
|
|
86
|
+
}
|
|
87
|
+
button {
|
|
88
|
+
background-color: #f9f9f9;
|
|
89
|
+
}
|
|
90
|
+
}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { defineConfig } from "npm:vite";
|
|
2
|
+
import vue from "npm:@vitejs/plugin-vue";
|
|
3
|
+
|
|
4
|
+
// NOTE(bartlomieju): this is a papercut that shouldn't be required, see README.md
|
|
5
|
+
import "npm:vue";
|
|
6
|
+
|
|
7
|
+
// https://vitejs.dev/config/
|
|
8
|
+
export default defineConfig({
|
|
9
|
+
plugins: [vue()],
|
|
10
|
+
});
|
|
@@ -3,7 +3,10 @@
|
|
|
3
3
|
"private": true,
|
|
4
4
|
"version": "0.0.0",
|
|
5
5
|
"type": "module",
|
|
6
|
-
"files": [
|
|
6
|
+
"files": [
|
|
7
|
+
"dist",
|
|
8
|
+
"index.d.ts"
|
|
9
|
+
],
|
|
7
10
|
"main": "./dist/counter.umd.cjs",
|
|
8
11
|
"module": "./dist/counter.js",
|
|
9
12
|
"types": "./index.d.ts",
|
|
@@ -17,6 +20,6 @@
|
|
|
17
20
|
"build": "vite build"
|
|
18
21
|
},
|
|
19
22
|
"devDependencies": {
|
|
20
|
-
"vite": "^3.
|
|
23
|
+
"vite": "^3.1.3"
|
|
21
24
|
}
|
|
22
25
|
}
|
|
@@ -3,7 +3,10 @@
|
|
|
3
3
|
"private": true,
|
|
4
4
|
"version": "0.0.0",
|
|
5
5
|
"type": "module",
|
|
6
|
-
"files": [
|
|
6
|
+
"files": [
|
|
7
|
+
"dist",
|
|
8
|
+
"index.d.ts"
|
|
9
|
+
],
|
|
7
10
|
"main": "./dist/counter.umd.cjs",
|
|
8
11
|
"module": "./dist/counter.js",
|
|
9
12
|
"types": "./index.d.ts",
|
|
@@ -17,7 +20,7 @@
|
|
|
17
20
|
"build": "tsc && vite build"
|
|
18
21
|
},
|
|
19
22
|
"devDependencies": {
|
|
20
|
-
"typescript": "^4.
|
|
21
|
-
"vite": "^3.
|
|
23
|
+
"typescript": "^4.8.3",
|
|
24
|
+
"vite": "^3.1.3"
|
|
22
25
|
}
|
|
23
26
|
}
|
|
@@ -13,13 +13,13 @@
|
|
|
13
13
|
"dependencies": {
|
|
14
14
|
"compression": "^1.7.4",
|
|
15
15
|
"express": "^4.18.1",
|
|
16
|
-
"preact": "^10.
|
|
17
|
-
"preact-render-to-string": "^5.2.
|
|
16
|
+
"preact": "^10.11.0",
|
|
17
|
+
"preact-render-to-string": "^5.2.4",
|
|
18
18
|
"sirv": "^2.0.2"
|
|
19
19
|
},
|
|
20
20
|
"devDependencies": {
|
|
21
|
-
"@preact/preset-vite": "^2.
|
|
21
|
+
"@preact/preset-vite": "^2.4.0",
|
|
22
22
|
"cross-env": "^7.0.3",
|
|
23
|
-
"vite": "^3.
|
|
23
|
+
"vite": "^3.1.3"
|
|
24
24
|
}
|
|
25
25
|
}
|
|
@@ -13,15 +13,15 @@
|
|
|
13
13
|
"dependencies": {
|
|
14
14
|
"compression": "^1.7.4",
|
|
15
15
|
"express": "^4.18.1",
|
|
16
|
-
"preact": "^10.
|
|
17
|
-
"preact-render-to-string": "^5.2.
|
|
16
|
+
"preact": "^10.11.0",
|
|
17
|
+
"preact-render-to-string": "^5.2.4",
|
|
18
18
|
"sirv": "^2.0.2"
|
|
19
19
|
},
|
|
20
20
|
"devDependencies": {
|
|
21
|
-
"@preact/preset-vite": "^2.
|
|
22
|
-
"@types/node": "^18.
|
|
21
|
+
"@preact/preset-vite": "^2.4.0",
|
|
22
|
+
"@types/node": "^18.7.21",
|
|
23
23
|
"cross-env": "^7.0.3",
|
|
24
|
-
"typescript": "^4.
|
|
25
|
-
"vite": "^3.
|
|
24
|
+
"typescript": "^4.8.3",
|
|
25
|
+
"vite": "^3.1.3"
|
|
26
26
|
}
|
|
27
27
|
}
|
|
@@ -14,9 +14,8 @@
|
|
|
14
14
|
"resolveJsonModule": true,
|
|
15
15
|
"isolatedModules": true,
|
|
16
16
|
"noEmit": true,
|
|
17
|
-
"jsx": "
|
|
18
|
-
"
|
|
19
|
-
"jsxFragmentFactory": "Fragment"
|
|
17
|
+
"jsx": "react-jsx",
|
|
18
|
+
"jsxImportSource": "preact"
|
|
20
19
|
},
|
|
21
20
|
"include": ["src"],
|
|
22
21
|
"references": [{ "path": "./tsconfig.node.json" }]
|
|
@@ -18,10 +18,10 @@
|
|
|
18
18
|
"sirv": "^2.0.2"
|
|
19
19
|
},
|
|
20
20
|
"devDependencies": {
|
|
21
|
-
"@types/react": "^18.0.
|
|
21
|
+
"@types/react": "^18.0.21",
|
|
22
22
|
"@types/react-dom": "^18.0.6",
|
|
23
|
-
"@vitejs/plugin-react": "^2.
|
|
23
|
+
"@vitejs/plugin-react": "^2.1.0",
|
|
24
24
|
"cross-env": "^7.0.3",
|
|
25
|
-
"vite": "^3.
|
|
25
|
+
"vite": "^3.1.3"
|
|
26
26
|
}
|
|
27
27
|
}
|
|
@@ -18,11 +18,11 @@
|
|
|
18
18
|
"sirv": "^2.0.2"
|
|
19
19
|
},
|
|
20
20
|
"devDependencies": {
|
|
21
|
-
"@types/react": "^18.0.
|
|
21
|
+
"@types/react": "^18.0.21",
|
|
22
22
|
"@types/react-dom": "^18.0.6",
|
|
23
|
-
"@vitejs/plugin-react": "^2.
|
|
23
|
+
"@vitejs/plugin-react": "^2.1.0",
|
|
24
24
|
"cross-env": "^7.0.3",
|
|
25
|
-
"typescript": "^4.
|
|
26
|
-
"vite": "^3.
|
|
25
|
+
"typescript": "^4.8.3",
|
|
26
|
+
"vite": "^3.1.3"
|
|
27
27
|
}
|
|
28
28
|
}
|
|
@@ -16,7 +16,6 @@ Check out [SvelteKit](https://github.com/sveltejs/kit#readme), which is also pow
|
|
|
16
16
|
|
|
17
17
|
- It brings its own routing solution which might not be preferable for some users.
|
|
18
18
|
- It is first and foremost a framework that just happens to use Vite under the hood, not a Vite app.
|
|
19
|
-
`vite dev` and `vite build` wouldn't work in a SvelteKit environment, for example.
|
|
20
19
|
|
|
21
20
|
This template contains as little as possible to get started with Vite + Svelte, while taking into account the developer experience with regards to HMR and intellisense. It demonstrates capabilities on par with the other `create-vite` templates and is a good starting point for beginners dipping their toes into a Vite + Svelte project.
|
|
22
21
|
|
|
@@ -16,9 +16,9 @@
|
|
|
16
16
|
"sirv": "^2.0.2"
|
|
17
17
|
},
|
|
18
18
|
"devDependencies": {
|
|
19
|
-
"@sveltejs/vite-plugin-svelte": "^1.0.
|
|
19
|
+
"@sveltejs/vite-plugin-svelte": "^1.0.8",
|
|
20
20
|
"cross-env": "^7.0.3",
|
|
21
|
-
"svelte": "^3.
|
|
22
|
-
"vite": "^3.
|
|
21
|
+
"svelte": "^3.50.1",
|
|
22
|
+
"vite": "^3.1.3"
|
|
23
23
|
}
|
|
24
24
|
}
|
|
@@ -16,7 +16,6 @@ Check out [SvelteKit](https://github.com/sveltejs/kit#readme), which is also pow
|
|
|
16
16
|
|
|
17
17
|
- It brings its own routing solution which might not be preferable for some users.
|
|
18
18
|
- It is first and foremost a framework that just happens to use Vite under the hood, not a Vite app.
|
|
19
|
-
`vite dev` and `vite build` wouldn't work in a SvelteKit environment, for example.
|
|
20
19
|
|
|
21
20
|
This template contains as little as possible to get started with Vite + TypeScript + Svelte, while taking into account the developer experience with regards to HMR and intellisense. It demonstrates capabilities on par with the other `create-vite` templates and is a good starting point for beginners dipping their toes into a Vite + Svelte project.
|
|
22
21
|
|
|
@@ -16,14 +16,14 @@
|
|
|
16
16
|
"sirv": "^2.0.2"
|
|
17
17
|
},
|
|
18
18
|
"devDependencies": {
|
|
19
|
-
"@sveltejs/vite-plugin-svelte": "^1.0.
|
|
19
|
+
"@sveltejs/vite-plugin-svelte": "^1.0.8",
|
|
20
20
|
"@tsconfig/svelte": "^3.0.0",
|
|
21
21
|
"cross-env": "^7.0.3",
|
|
22
|
-
"svelte": "^3.
|
|
23
|
-
"svelte-check": "^2.
|
|
22
|
+
"svelte": "^3.50.1",
|
|
23
|
+
"svelte-check": "^2.9.0",
|
|
24
24
|
"svelte-preprocess": "^4.10.7",
|
|
25
25
|
"tslib": "^2.4.0",
|
|
26
|
-
"typescript": "^4.
|
|
27
|
-
"vite": "^3.
|
|
26
|
+
"typescript": "^4.8.3",
|
|
27
|
+
"vite": "^3.1.3"
|
|
28
28
|
}
|
|
29
29
|
}
|
|
@@ -16,10 +16,10 @@
|
|
|
16
16
|
"sirv": "^2.0.2"
|
|
17
17
|
},
|
|
18
18
|
"devDependencies": {
|
|
19
|
-
"@types/express": "^4.17.
|
|
20
|
-
"@types/node": "^18.
|
|
19
|
+
"@types/express": "^4.17.14",
|
|
20
|
+
"@types/node": "^18.7.21",
|
|
21
21
|
"cross-env": "^7.0.3",
|
|
22
|
-
"typescript": "^4.
|
|
23
|
-
"vite": "^3.
|
|
22
|
+
"typescript": "^4.8.3",
|
|
23
|
+
"vite": "^3.1.3"
|
|
24
24
|
}
|
|
25
25
|
}
|
|
@@ -4,6 +4,6 @@ export function setupCounter(element: HTMLButtonElement) {
|
|
|
4
4
|
counter = count
|
|
5
5
|
element.innerHTML = `count is ${counter}`
|
|
6
6
|
}
|
|
7
|
-
element.addEventListener('click', () => setCounter(
|
|
7
|
+
element.addEventListener('click', () => setCounter(counter + 1))
|
|
8
8
|
setCounter(0)
|
|
9
9
|
}
|
|
@@ -14,11 +14,11 @@
|
|
|
14
14
|
"compression": "^1.7.4",
|
|
15
15
|
"express": "^4.18.1",
|
|
16
16
|
"sirv": "^2.0.2",
|
|
17
|
-
"vue": "^3.2.
|
|
17
|
+
"vue": "^3.2.39"
|
|
18
18
|
},
|
|
19
19
|
"devDependencies": {
|
|
20
|
-
"@vitejs/plugin-vue": "^3.0
|
|
20
|
+
"@vitejs/plugin-vue": "^3.1.0",
|
|
21
21
|
"cross-env": "^7.0.3",
|
|
22
|
-
"vite": "^3.
|
|
22
|
+
"vite": "^3.1.3"
|
|
23
23
|
}
|
|
24
24
|
}
|
|
@@ -14,13 +14,13 @@
|
|
|
14
14
|
"compression": "^1.7.4",
|
|
15
15
|
"express": "^4.18.1",
|
|
16
16
|
"sirv": "^2.0.2",
|
|
17
|
-
"vue": "^3.2.
|
|
17
|
+
"vue": "^3.2.39"
|
|
18
18
|
},
|
|
19
19
|
"devDependencies": {
|
|
20
|
-
"@vitejs/plugin-vue": "^3.0
|
|
20
|
+
"@vitejs/plugin-vue": "^3.1.0",
|
|
21
21
|
"cross-env": "^7.0.3",
|
|
22
|
-
"typescript": "^4.
|
|
23
|
-
"vite": "^3.
|
|
24
|
-
"vue-tsc": "^0.
|
|
22
|
+
"typescript": "^4.8.3",
|
|
23
|
+
"vite": "^3.1.3",
|
|
24
|
+
"vue-tsc": "^0.40.13"
|
|
25
25
|
}
|
|
26
26
|
}
|
|
@@ -6,12 +6,12 @@
|
|
|
6
6
|
"moduleResolution": "Node",
|
|
7
7
|
"strict": true,
|
|
8
8
|
"jsx": "preserve",
|
|
9
|
-
"sourceMap": true,
|
|
10
9
|
"resolveJsonModule": true,
|
|
11
10
|
"isolatedModules": true,
|
|
12
11
|
"esModuleInterop": true,
|
|
13
12
|
"lib": ["ESNext", "DOM"],
|
|
14
|
-
"skipLibCheck": true
|
|
13
|
+
"skipLibCheck": true,
|
|
14
|
+
"noEmit": true
|
|
15
15
|
},
|
|
16
16
|
"include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"],
|
|
17
17
|
"references": [{ "path": "./tsconfig.node.json" }]
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import JSX = preact.JSX
|