fe-kit-cli 0.0.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 +89 -0
- package/dist/cli.mjs +1738 -0
- package/dist/cli.mjs.map +1 -0
- package/dist/rules/common/typescript.mdc +21 -0
- package/dist/rules/react/component-conventions.mdc +24 -0
- package/dist/rules/react/hooks.mdc +20 -0
- package/dist/rules/react/react-router.mdc +18 -0
- package/dist/rules/react/state-management.mdc +21 -0
- package/dist/rules/vue/component-conventions.mdc +23 -0
- package/dist/rules/vue/composition-api.mdc +24 -0
- package/dist/rules/vue/state-management.mdc +16 -0
- package/dist/rules/vue/vue-router.mdc +18 -0
- package/dist/skills/app-ui-design/SKILL.md +62 -0
- package/dist/skills/app-ui-design/references/rules.md +127 -0
- package/dist/skills/e2e-testing/SKILL.md +327 -0
- package/dist/skills/eval-harness/SKILL.md +271 -0
- package/dist/skills/frontend-design/SKILL.md +43 -0
- package/dist/skills/frontend-patterns/SKILL.md +643 -0
- package/dist/skills/security-review/SKILL.md +496 -0
- package/dist/skills/tailwindcss-advanced-layouts/SKILL.md +595 -0
- package/dist/skills/tdd-workflow/SKILL.md +464 -0
- package/dist/skills/verification-loop/SKILL.md +127 -0
- package/dist/skills/wechat-ui-design/SKILL.md +64 -0
- package/dist/skills/wechat-ui-design/references/rules.md +121 -0
- package/dist/templates/react-rspack-ts/index.html +11 -0
- package/dist/templates/react-rspack-ts/package.json +20 -0
- package/dist/templates/react-rspack-ts/rspack.config.ts +23 -0
- package/dist/templates/react-rspack-ts/src/App.tsx +7 -0
- package/dist/templates/react-rspack-ts/src/main.tsx +9 -0
- package/dist/templates/react-rspack-ts/tsconfig.json +17 -0
- package/dist/templates/react-vite-ts/index.html +12 -0
- package/dist/templates/react-vite-ts/package.json +22 -0
- package/dist/templates/react-vite-ts/src/App.tsx +7 -0
- package/dist/templates/react-vite-ts/src/main.tsx +9 -0
- package/dist/templates/react-vite-ts/tsconfig.json +19 -0
- package/dist/templates/react-vite-ts/vite.config.ts +9 -0
- package/dist/templates/react-webpack-ts/index.html +11 -0
- package/dist/templates/react-webpack-ts/package.json +25 -0
- package/dist/templates/react-webpack-ts/src/App.tsx +7 -0
- package/dist/templates/react-webpack-ts/src/main.tsx +9 -0
- package/dist/templates/react-webpack-ts/tsconfig.json +17 -0
- package/dist/templates/react-webpack-ts/webpack.config.ts +29 -0
- package/dist/templates/vue-rspack-ts/index.html +11 -0
- package/dist/templates/vue-rspack-ts/package.json +18 -0
- package/dist/templates/vue-rspack-ts/rspack.config.ts +16 -0
- package/dist/templates/vue-rspack-ts/src/App.vue +7 -0
- package/dist/templates/vue-rspack-ts/src/main.ts +4 -0
- package/dist/templates/vue-rspack-ts/tsconfig.json +17 -0
- package/dist/templates/vue-vite-ts/index.html +12 -0
- package/dist/templates/vue-vite-ts/package.json +19 -0
- package/dist/templates/vue-vite-ts/src/App.vue +7 -0
- package/dist/templates/vue-vite-ts/src/main.ts +4 -0
- package/dist/templates/vue-vite-ts/tsconfig.json +19 -0
- package/dist/templates/vue-vite-ts/vite.config.ts +9 -0
- package/dist/templates/vue-webpack-ts/index.html +11 -0
- package/dist/templates/vue-webpack-ts/package.json +24 -0
- package/dist/templates/vue-webpack-ts/src/App.vue +7 -0
- package/dist/templates/vue-webpack-ts/src/main.ts +4 -0
- package/dist/templates/vue-webpack-ts/tsconfig.json +17 -0
- package/dist/templates/vue-webpack-ts/webpack.config.ts +32 -0
- package/package.json +63 -0
|
@@ -0,0 +1,121 @@
|
|
|
1
|
+
---
|
|
2
|
+
description: Review UI code for 官微 UI 设计规范 compliance
|
|
3
|
+
argument-hint: <file-or-pattern>
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
# 官微 UI 设计规范（规则说明）
|
|
7
|
+
|
|
8
|
+
输出格式遵循 Web Interface Guidelines 的“按分组列问题/规则 + 最终 ✓ pass”风格（不包含 source:loc 标记）。
|
|
9
|
+
|
|
10
|
+
---
|
|
11
|
+
|
|
12
|
+
## 01. Design Core / Visual Keywords
|
|
13
|
+
|
|
14
|
+
视觉关键词聚焦“活力 / 品质 / 现代简约”，设计决策必须围绕这三点收敛，拒绝与品牌调性冲突的装饰性元素。
|
|
15
|
+
|
|
16
|
+
## 02. Color System
|
|
17
|
+
|
|
18
|
+
- 主色用于关键按钮 / 标题栏 / 品牌标识等关键元素；辅助色用于信息分层与模块区分，避免喧宾夺主。
|
|
19
|
+
- **禁止**除首页背景外在其它页面使用透明度/渐变黄色；该背景色只允许用于一级页面，二级及之后页面不出现。
|
|
20
|
+
标签色语义（需统一、可复用）：
|
|
21
|
+
- `#FFE10A`（原文可能识别为 `#FFEIOA`）用于提醒/警示（限时活动/即将开始等）
|
|
22
|
+
- `#00C864`（原文可能识别为 `#0OC864`）用于进行/可行（进行中/保障中/有效等）
|
|
23
|
+
- `#006ECD` 用于其他/等待（其他/预约中等）
|
|
24
|
+
- `#ED6C30` 用于结束/不可行（活动结束/已失效/已到期等）与其他未完成状态（未核销/未提交等）
|
|
25
|
+
|
|
26
|
+
## 03. Typography / Font & Type Scale
|
|
27
|
+
|
|
28
|
+
- 字体基线：中文使用「思源黑体」，数字/英文使用「Plus Jakarta Sans」。
|
|
29
|
+
字重语义：
|
|
30
|
+
- Regular：副标题/内容/组件与功能按钮未选中
|
|
31
|
+
- Medium：大标题/按钮/组件与功能按钮选中
|
|
32
|
+
- SemiBold：总数据展示（强调数字信息）
|
|
33
|
+
|
|
34
|
+
- 字号按 2 的倍数递增/递减；行高为字号的 1.3 倍；页面最大字号 60pt、最小字号 12pt。
|
|
35
|
+
- 大标题：18pt（中文 Medium / 英文 SemiBold），行高 24px。
|
|
36
|
+
- 副标题/内容页标题：16pt（中文 Medium），行高 22px。
|
|
37
|
+
- 卡片小标题/按钮/内容：14pt（中文 Medium/Regular），行高 20px。
|
|
38
|
+
- 标签/Tab：12pt（中文 Medium），行高 16px。
|
|
39
|
+
- 一级 Tab：字号 16pt，行高 22px；选中 Medium，未选中 Regular。
|
|
40
|
+
- 二级标签导航：字号 12pt，行高 16px；选中 Medium，未选中 Regular。
|
|
41
|
+
|
|
42
|
+
## 04. Spacing & Layout
|
|
43
|
+
|
|
44
|
+
- 全局间距使用 4 的倍数（n*4），元素尺寸（图标/组件等）同样遵守该原则。
|
|
45
|
+
- 在极少数特殊屏宽（如 1px 级误差）导致横向间距为奇数时，允许出现不可避免的奇数值，但必须解释原因并限制影响范围。
|
|
46
|
+
- 全局左右边距固定 20px / 20px。
|
|
47
|
+
|
|
48
|
+
## 05. Navigation
|
|
49
|
+
|
|
50
|
+
- 顶部导航默认高度 88px。
|
|
51
|
+
- 底部导航默认高度 86px（不含超出部分）。
|
|
52
|
+
- Tab 导航字段不等分；字段间距 24px/36px（按 Tab 数量适配）；底部高亮条尺寸保持不变。
|
|
53
|
+
- Tab 高亮条颜色为 `#FFE10A`（“我的权益”页面可随板块内容变更颜色，但尺寸不变）。
|
|
54
|
+
- 一级 Tab 最右状态：固定右边间距，导航之间间距等分 24px。
|
|
55
|
+
- 二级标签导航通常在一级 Tab 下使用；标签之间间距**不随数量变化**（保持一致节奏）。
|
|
56
|
+
- 二级标签导航初始状态：固定左边间距，导航之间间距等分 12px。
|
|
57
|
+
- 二级标签导航最右状态：固定右边间距，导航之间间距等分 12px。
|
|
58
|
+
- 二级标签导航在组件内白底/组件外有色底均需定义清晰状态，不得“只在白底可读”。
|
|
59
|
+
|
|
60
|
+
## 06. Tags / Badges
|
|
61
|
+
|
|
62
|
+
- 标准标签：字号 12pt，行高 16px，字重 Medium。
|
|
63
|
+
- 特殊样式仅在保单页面使用；组件顶部需配合标签颜色做渐变处理（不要把这套渐变扩散到其它业务页）。
|
|
64
|
+
- 特殊标签（限时任务组件）字号 16pt，行高 16px（1 倍），字重 Medium（用在强运营/强强调场景，避免滥用）。
|
|
65
|
+
|
|
66
|
+
## 07. Buttons
|
|
67
|
+
|
|
68
|
+
- 按钮字体大小不随按钮尺寸变化；按钮宽度随字数变化或适配页面/卡片宽度。
|
|
69
|
+
- 小按钮高度 32px；带图标按钮图标尺寸 14×14px（包含下拉菜单按钮）。
|
|
70
|
+
- 按钮字号 14pt；按钮存在明确层级。
|
|
71
|
+
|
|
72
|
+
按钮层级语义：
|
|
73
|
+
- 主要按钮：页面核心操作（提交/领取/确认等）
|
|
74
|
+
- 次要按钮：备选方案/非关键操作，优先级低于主要按钮
|
|
75
|
+
- 辅助按钮：低优先级补充功能或跳转类操作，不应抢注意力
|
|
76
|
+
- 置灰按钮：不可操作，常用于失效/过期页面
|
|
77
|
+
|
|
78
|
+
- 按钮排版：左右预留 20px；同一行最多 2 个按钮；按钮间距 15px。
|
|
79
|
+
- 全屏按钮适配：宽度示例 160px；支持主要/次要组合，但仍需遵守“同一行最多 2 个”的约束。
|
|
80
|
+
- 卡片内按钮适配：宽度示例 140px；遵循主要/次要组合规则。
|
|
81
|
+
|
|
82
|
+
## 08. Inputs
|
|
83
|
+
|
|
84
|
+
- 输入框存在默认/输入/禁用等状态；同一类表单控件必须统一状态样式与间距（避免同屏混用不同输入框规格）。
|
|
85
|
+
|
|
86
|
+
## 09. Cards
|
|
87
|
+
|
|
88
|
+
- 卡片容器默认：宽度 335px；上下左右边距各 20px；圆角 8px；高度随内容自适应。
|
|
89
|
+
|
|
90
|
+
## 10. Toast / Notice (提示框)
|
|
91
|
+
|
|
92
|
+
- 提示框用颜色区分级别；高度 48px；宽度可适配组件内/外（295px / 335px）。
|
|
93
|
+
- 提示框文字：字号 14px，行高 20px（1.3 倍），字重 Regular。
|
|
94
|
+
- 提示框可置于卡片外或卡片内；两种布局都必须保持同高度/间距一致性，不要“卡片内一套、卡片外另一套”。
|
|
95
|
+
|
|
96
|
+
## 11. Level Badge (等级徽章)
|
|
97
|
+
|
|
98
|
+
- 徽章尺寸固定 100×100px；风格调性统一、尺寸一致。
|
|
99
|
+
- 未获得的徽章为灰色状态（明确区分“未获得”而非“加载失败”）。
|
|
100
|
+
- 徽章组件背景色使用与当前徽章色相近色（避免背景与徽章冲突导致“脏”）。
|
|
101
|
+
|
|
102
|
+
等级组件字体：
|
|
103
|
+
- 辅助文字：14pt，行高 20px（1.3 倍），Regular
|
|
104
|
+
- 等级数字：26pt，行高 32px（1.3 倍），Medium
|
|
105
|
+
|
|
106
|
+
- 徽章区按钮允许超出卡片：按钮高度的 1/2；按钮与徽章左右居中对齐（不允许“随手放”）。
|
|
107
|
+
|
|
108
|
+
## 12. Images (运营物料)
|
|
109
|
+
|
|
110
|
+
- 图片尺寸需要在不同组件下保持一致展示（同类卡片/同类模块必须用同规格图）。
|
|
111
|
+
- 组件 banner：335×193px，圆角 8px。
|
|
112
|
+
- 卡片内 banner：240×110px，圆角 8px。
|
|
113
|
+
|
|
114
|
+
内容页图片：
|
|
115
|
+
- 卡片内新闻/通告类缩略图：80×80px，圆角 4px
|
|
116
|
+
- 大图/头图：宽 335px，高度自适应，圆角 8px
|
|
117
|
+
|
|
118
|
+
## 13. Quick Sanity Check
|
|
119
|
+
|
|
120
|
+
✓ pass - 如果页面满足：4px 网格间距、全局左右 20px、主色使用克制（无滥用渐变/透明度）、字号遵循 12–60pt 且 2pt 步进、Tab/按钮/卡片/提示框尺寸一致且可解释。
|
|
121
|
+
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "react-rspack-ts",
|
|
3
|
+
"private": true,
|
|
4
|
+
"version": "0.1.0",
|
|
5
|
+
"scripts": {
|
|
6
|
+
"dev": "rspack serve",
|
|
7
|
+
"build": "rspack build"
|
|
8
|
+
},
|
|
9
|
+
"dependencies": {
|
|
10
|
+
"react": "^19.0.0",
|
|
11
|
+
"react-dom": "^19.0.0"
|
|
12
|
+
},
|
|
13
|
+
"devDependencies": {
|
|
14
|
+
"@types/react": "^19.0.0",
|
|
15
|
+
"@types/react-dom": "^19.0.0",
|
|
16
|
+
"@rspack/cli": "^1.3.0",
|
|
17
|
+
"@rspack/core": "^1.3.0",
|
|
18
|
+
"typescript": "^5.8.0"
|
|
19
|
+
}
|
|
20
|
+
}
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { defineConfig } from '@rspack/cli';
|
|
2
|
+
|
|
3
|
+
export default defineConfig({
|
|
4
|
+
entry: { main: './src/main.tsx' },
|
|
5
|
+
resolve: {
|
|
6
|
+
extensions: ['.ts', '.tsx', '.js', '.jsx'],
|
|
7
|
+
},
|
|
8
|
+
module: {
|
|
9
|
+
rules: [
|
|
10
|
+
{
|
|
11
|
+
test: /\.tsx?$/,
|
|
12
|
+
loader: 'builtin:swc-loader',
|
|
13
|
+
options: {
|
|
14
|
+
jsc: {
|
|
15
|
+
parser: { syntax: 'typescript', tsx: true },
|
|
16
|
+
transform: { react: { runtime: 'automatic' } },
|
|
17
|
+
},
|
|
18
|
+
},
|
|
19
|
+
type: 'javascript/auto',
|
|
20
|
+
},
|
|
21
|
+
],
|
|
22
|
+
},
|
|
23
|
+
});
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
{
|
|
2
|
+
"compilerOptions": {
|
|
3
|
+
"target": "ES2020",
|
|
4
|
+
"module": "ESNext",
|
|
5
|
+
"moduleResolution": "bundler",
|
|
6
|
+
"strict": true,
|
|
7
|
+
"jsx": "react-jsx",
|
|
8
|
+
"esModuleInterop": true,
|
|
9
|
+
"skipLibCheck": true,
|
|
10
|
+
"forceConsistentCasingInFileNames": true,
|
|
11
|
+
"resolveJsonModule": true,
|
|
12
|
+
"isolatedModules": true,
|
|
13
|
+
"baseUrl": ".",
|
|
14
|
+
"paths": { "@/*": ["src/*"] }
|
|
15
|
+
},
|
|
16
|
+
"include": ["src"]
|
|
17
|
+
}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8" />
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
6
|
+
<title>React + TypeScript</title>
|
|
7
|
+
</head>
|
|
8
|
+
<body>
|
|
9
|
+
<div id="root"></div>
|
|
10
|
+
<script type="module" src="/src/main.tsx"></script>
|
|
11
|
+
</body>
|
|
12
|
+
</html>
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "react-vite-ts",
|
|
3
|
+
"private": true,
|
|
4
|
+
"version": "0.1.0",
|
|
5
|
+
"type": "module",
|
|
6
|
+
"scripts": {
|
|
7
|
+
"dev": "vite",
|
|
8
|
+
"build": "vite build",
|
|
9
|
+
"preview": "vite preview"
|
|
10
|
+
},
|
|
11
|
+
"dependencies": {
|
|
12
|
+
"react": "^19.0.0",
|
|
13
|
+
"react-dom": "^19.0.0"
|
|
14
|
+
},
|
|
15
|
+
"devDependencies": {
|
|
16
|
+
"@types/react": "^19.0.0",
|
|
17
|
+
"@types/react-dom": "^19.0.0",
|
|
18
|
+
"@vitejs/plugin-react": "^4.4.0",
|
|
19
|
+
"typescript": "^5.8.0",
|
|
20
|
+
"vite": "^6.3.0"
|
|
21
|
+
}
|
|
22
|
+
}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
{
|
|
2
|
+
"compilerOptions": {
|
|
3
|
+
"target": "ES2020",
|
|
4
|
+
"module": "ESNext",
|
|
5
|
+
"moduleResolution": "bundler",
|
|
6
|
+
"strict": true,
|
|
7
|
+
"jsx": "react-jsx",
|
|
8
|
+
"esModuleInterop": true,
|
|
9
|
+
"skipLibCheck": true,
|
|
10
|
+
"forceConsistentCasingInFileNames": true,
|
|
11
|
+
"resolveJsonModule": true,
|
|
12
|
+
"isolatedModules": true,
|
|
13
|
+
"baseUrl": ".",
|
|
14
|
+
"paths": {
|
|
15
|
+
"@/*": ["src/*"]
|
|
16
|
+
}
|
|
17
|
+
},
|
|
18
|
+
"include": ["src"]
|
|
19
|
+
}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "react-webpack-ts",
|
|
3
|
+
"private": true,
|
|
4
|
+
"version": "0.1.0",
|
|
5
|
+
"scripts": {
|
|
6
|
+
"dev": "webpack serve --mode development",
|
|
7
|
+
"build": "webpack --mode production"
|
|
8
|
+
},
|
|
9
|
+
"dependencies": {
|
|
10
|
+
"react": "^19.0.0",
|
|
11
|
+
"react-dom": "^19.0.0"
|
|
12
|
+
},
|
|
13
|
+
"devDependencies": {
|
|
14
|
+
"@types/react": "^19.0.0",
|
|
15
|
+
"@types/react-dom": "^19.0.0",
|
|
16
|
+
"css-loader": "^7.1.0",
|
|
17
|
+
"html-webpack-plugin": "^5.6.0",
|
|
18
|
+
"style-loader": "^4.0.0",
|
|
19
|
+
"ts-loader": "^9.5.0",
|
|
20
|
+
"typescript": "^5.8.0",
|
|
21
|
+
"webpack": "^5.99.0",
|
|
22
|
+
"webpack-cli": "^6.0.0",
|
|
23
|
+
"webpack-dev-server": "^5.2.0"
|
|
24
|
+
}
|
|
25
|
+
}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
{
|
|
2
|
+
"compilerOptions": {
|
|
3
|
+
"target": "ES2020",
|
|
4
|
+
"module": "ESNext",
|
|
5
|
+
"moduleResolution": "bundler",
|
|
6
|
+
"strict": true,
|
|
7
|
+
"jsx": "react-jsx",
|
|
8
|
+
"esModuleInterop": true,
|
|
9
|
+
"skipLibCheck": true,
|
|
10
|
+
"forceConsistentCasingInFileNames": true,
|
|
11
|
+
"resolveJsonModule": true,
|
|
12
|
+
"isolatedModules": true,
|
|
13
|
+
"baseUrl": ".",
|
|
14
|
+
"paths": { "@/*": ["src/*"] }
|
|
15
|
+
},
|
|
16
|
+
"include": ["src"]
|
|
17
|
+
}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import path from 'path';
|
|
2
|
+
import HtmlWebpackPlugin from 'html-webpack-plugin';
|
|
3
|
+
|
|
4
|
+
export default {
|
|
5
|
+
mode: 'development',
|
|
6
|
+
entry: './src/main.tsx',
|
|
7
|
+
output: {
|
|
8
|
+
path: path.resolve(__dirname, 'dist'),
|
|
9
|
+
filename: 'bundle.js',
|
|
10
|
+
clean: true,
|
|
11
|
+
},
|
|
12
|
+
resolve: {
|
|
13
|
+
extensions: ['.ts', '.tsx', '.js', '.jsx'],
|
|
14
|
+
alias: { '@': path.resolve(__dirname, 'src') },
|
|
15
|
+
},
|
|
16
|
+
module: {
|
|
17
|
+
rules: [
|
|
18
|
+
{ test: /\.tsx?$/, loader: 'ts-loader', exclude: /node_modules/ },
|
|
19
|
+
{ test: /\.css$/, use: ['style-loader', 'css-loader'] },
|
|
20
|
+
],
|
|
21
|
+
},
|
|
22
|
+
plugins: [
|
|
23
|
+
new HtmlWebpackPlugin({ template: './index.html' }),
|
|
24
|
+
],
|
|
25
|
+
devServer: {
|
|
26
|
+
port: 3000,
|
|
27
|
+
hot: true,
|
|
28
|
+
},
|
|
29
|
+
};
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "vue-rspack-ts",
|
|
3
|
+
"private": true,
|
|
4
|
+
"version": "0.1.0",
|
|
5
|
+
"scripts": {
|
|
6
|
+
"dev": "rspack serve",
|
|
7
|
+
"build": "rspack build"
|
|
8
|
+
},
|
|
9
|
+
"dependencies": {
|
|
10
|
+
"vue": "^3.5.0"
|
|
11
|
+
},
|
|
12
|
+
"devDependencies": {
|
|
13
|
+
"@rspack/cli": "^1.3.0",
|
|
14
|
+
"@rspack/core": "^1.3.0",
|
|
15
|
+
"@rspack/plugin-vue": "^1.0.0",
|
|
16
|
+
"typescript": "^5.8.0"
|
|
17
|
+
}
|
|
18
|
+
}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { defineConfig } from '@rspack/cli';
|
|
2
|
+
import { VueLoaderPlugin } from '@rspack/plugin-vue';
|
|
3
|
+
|
|
4
|
+
export default defineConfig({
|
|
5
|
+
entry: { main: './src/main.ts' },
|
|
6
|
+
resolve: {
|
|
7
|
+
extensions: ['.ts', '.js', '.vue'],
|
|
8
|
+
},
|
|
9
|
+
module: {
|
|
10
|
+
rules: [
|
|
11
|
+
{ test: /\.vue$/, loader: 'vue-loader', options: { experimentalInlineMatchResource: true } },
|
|
12
|
+
{ test: /\.ts$/, loader: 'builtin:swc-loader', options: { jsc: { parser: { syntax: 'typescript' } } }, type: 'javascript/auto' },
|
|
13
|
+
],
|
|
14
|
+
},
|
|
15
|
+
plugins: [new VueLoaderPlugin()],
|
|
16
|
+
});
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
{
|
|
2
|
+
"compilerOptions": {
|
|
3
|
+
"target": "ES2020",
|
|
4
|
+
"module": "ESNext",
|
|
5
|
+
"moduleResolution": "bundler",
|
|
6
|
+
"strict": true,
|
|
7
|
+
"jsx": "preserve",
|
|
8
|
+
"esModuleInterop": true,
|
|
9
|
+
"skipLibCheck": true,
|
|
10
|
+
"forceConsistentCasingInFileNames": true,
|
|
11
|
+
"resolveJsonModule": true,
|
|
12
|
+
"isolatedModules": true,
|
|
13
|
+
"baseUrl": ".",
|
|
14
|
+
"paths": { "@/*": ["src/*"] }
|
|
15
|
+
},
|
|
16
|
+
"include": ["src/**/*.ts", "src/**/*.vue"]
|
|
17
|
+
}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8" />
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
6
|
+
<title>Vue + TypeScript</title>
|
|
7
|
+
</head>
|
|
8
|
+
<body>
|
|
9
|
+
<div id="app"></div>
|
|
10
|
+
<script type="module" src="/src/main.ts"></script>
|
|
11
|
+
</body>
|
|
12
|
+
</html>
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "vue-vite-ts",
|
|
3
|
+
"private": true,
|
|
4
|
+
"version": "0.1.0",
|
|
5
|
+
"type": "module",
|
|
6
|
+
"scripts": {
|
|
7
|
+
"dev": "vite",
|
|
8
|
+
"build": "vite build",
|
|
9
|
+
"preview": "vite preview"
|
|
10
|
+
},
|
|
11
|
+
"dependencies": {
|
|
12
|
+
"vue": "^3.5.0"
|
|
13
|
+
},
|
|
14
|
+
"devDependencies": {
|
|
15
|
+
"@vitejs/plugin-vue": "^5.2.0",
|
|
16
|
+
"typescript": "^5.8.0",
|
|
17
|
+
"vite": "^6.3.0"
|
|
18
|
+
}
|
|
19
|
+
}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
{
|
|
2
|
+
"compilerOptions": {
|
|
3
|
+
"target": "ES2020",
|
|
4
|
+
"module": "ESNext",
|
|
5
|
+
"moduleResolution": "bundler",
|
|
6
|
+
"strict": true,
|
|
7
|
+
"jsx": "preserve",
|
|
8
|
+
"esModuleInterop": true,
|
|
9
|
+
"skipLibCheck": true,
|
|
10
|
+
"forceConsistentCasingInFileNames": true,
|
|
11
|
+
"resolveJsonModule": true,
|
|
12
|
+
"isolatedModules": true,
|
|
13
|
+
"baseUrl": ".",
|
|
14
|
+
"paths": {
|
|
15
|
+
"@/*": ["src/*"]
|
|
16
|
+
}
|
|
17
|
+
},
|
|
18
|
+
"include": ["src/**/*.ts", "src/**/*.vue"]
|
|
19
|
+
}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "vue-webpack-ts",
|
|
3
|
+
"private": true,
|
|
4
|
+
"version": "0.1.0",
|
|
5
|
+
"scripts": {
|
|
6
|
+
"dev": "webpack serve --mode development",
|
|
7
|
+
"build": "webpack --mode production"
|
|
8
|
+
},
|
|
9
|
+
"dependencies": {
|
|
10
|
+
"vue": "^3.5.0"
|
|
11
|
+
},
|
|
12
|
+
"devDependencies": {
|
|
13
|
+
"@vitejs/plugin-vue": "^5.2.0",
|
|
14
|
+
"css-loader": "^7.1.0",
|
|
15
|
+
"html-webpack-plugin": "^5.6.0",
|
|
16
|
+
"style-loader": "^4.0.0",
|
|
17
|
+
"ts-loader": "^9.5.0",
|
|
18
|
+
"typescript": "^5.8.0",
|
|
19
|
+
"vue-loader": "^17.4.0",
|
|
20
|
+
"webpack": "^5.99.0",
|
|
21
|
+
"webpack-cli": "^6.0.0",
|
|
22
|
+
"webpack-dev-server": "^5.2.0"
|
|
23
|
+
}
|
|
24
|
+
}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
{
|
|
2
|
+
"compilerOptions": {
|
|
3
|
+
"target": "ES2020",
|
|
4
|
+
"module": "ESNext",
|
|
5
|
+
"moduleResolution": "bundler",
|
|
6
|
+
"strict": true,
|
|
7
|
+
"jsx": "preserve",
|
|
8
|
+
"esModuleInterop": true,
|
|
9
|
+
"skipLibCheck": true,
|
|
10
|
+
"forceConsistentCasingInFileNames": true,
|
|
11
|
+
"resolveJsonModule": true,
|
|
12
|
+
"isolatedModules": true,
|
|
13
|
+
"baseUrl": ".",
|
|
14
|
+
"paths": { "@/*": ["src/*"] }
|
|
15
|
+
},
|
|
16
|
+
"include": ["src/**/*.ts", "src/**/*.vue"]
|
|
17
|
+
}
|