Skip to content

Commit 423d885

Browse files
KeJunMaoKeJunMao
committed
chore: add examples
1 parent 75c1ca8 commit 423d885

File tree

10 files changed

+328
-10
lines changed

10 files changed

+328
-10
lines changed

‎examples/vite-vue-ts/index.html‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
<!doctype html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<title>Vite + Vue + TS</title>
8+
</head>
9+
10+
<body>
11+
<div id="app"></div>
12+
<script type="module" src="/src/main.ts"></script>
13+
</body>
14+
15+
</html>

‎examples/vite-vue-ts/package.json‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
{
2+
"name": "vite-vue-ts",
3+
"private": true,
4+
"version": "0.0.0",
5+
"type": "module",
6+
"scripts": {
7+
"dev": "vite",
8+
"build": "vue-tsc && vite build",
9+
"preview": "vite preview"
10+
},
11+
"dependencies": {
12+
"vue": "^3.3.4"
13+
},
14+
"devDependencies": {
15+
"unplugin-preprocessor-directives": "workspace:*",
16+
"@vitejs/plugin-vue": "^4.2.3",
17+
"typescript": "^5.0.2",
18+
"vite": "^4.4.5",
19+
"vue-tsc": "^1.8.5"
20+
}
21+
}

‎examples/vite-vue-ts/src/App.vue‎

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
<script setup lang="ts">
2+
import { ref } from 'vue'
3+
4+
const data = ref(1)
5+
// #if !(DEV||PROD)
6+
data.value += 1
7+
// #endif
8+
</script>
9+
10+
<template>
11+
<div>
12+
<div>{{ data }}</div>
13+
<!-- #if DEV -->
14+
DEV
15+
<!-- #endif -->
16+
17+
<!-- #if !PROD -->
18+
!PROD
19+
<!-- #endif -->
20+
</div>
21+
</template>
22+
23+
<style>
24+
/* #if PROD */
25+
body {
26+
color: red;
27+
}
28+
29+
/* #else */
30+
body {
31+
background-color: red;
32+
}
33+
34+
/* #endif */
35+
36+
/* #if DEV */
37+
body {
38+
color: green;
39+
}
40+
41+
/* #else */
42+
body {
43+
background-color: green;
44+
}
45+
46+
/* #endif */
47+
</style>

‎examples/vite-vue-ts/src/main.ts‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
import { createApp } from 'vue'
2+
import App from './App.vue'
3+
4+
createApp(App).mount('#app')

‎examples/vite-vue-ts/src/vite-env.d.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
/// <reference types="vite/client" />

‎examples/vite-vue-ts/tsconfig.json‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
{
2+
"compilerOptions": {
3+
"target": "ES2020",
4+
"useDefineForClassFields": true,
5+
"module": "ESNext",
6+
"lib": ["ES2020", "DOM", "DOM.Iterable"],
7+
"skipLibCheck": true,
8+
9+
/* Bundler mode */
10+
"moduleResolution": "bundler",
11+
"allowImportingTsExtensions": true,
12+
"resolveJsonModule": true,
13+
"isolatedModules": true,
14+
"noEmit": true,
15+
"jsx": "preserve",
16+
17+
/* Linting */
18+
"strict": true,
19+
"noUnusedLocals": true,
20+
"noUnusedParameters": true,
21+
"noFallthroughCasesInSwitch": true
22+
},
23+
"include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"],
24+
"references": [{ "path": "./tsconfig.node.json" }]
25+
}

‎examples/vite-vue-ts/tsconfig.node.json‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
{
2+
"compilerOptions": {
3+
"composite": true,
4+
"skipLibCheck": true,
5+
"module": "ESNext",
6+
"moduleResolution": "bundler",
7+
"allowSyntheticDefaultImports": true
8+
},
9+
"include": ["vite.config.ts"]
10+
}

‎examples/vite-vue-ts/vite.config.ts‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
import { defineConfig } from 'vite'
2+
import vue from '@vitejs/plugin-vue'
3+
import PreprocessorDirectives from 'unplugin-preprocessor-directives/vite'
4+
5+
// https://vitejs.dev/config/
6+
export default defineConfig({
7+
plugins: [vue(), PreprocessorDirectives()],
8+
})

0 commit comments

Comments
 (0)