create-vite-react-cli 1.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/LICENSE ADDED
@@ -0,0 +1,21 @@
1
+ MIT License
2
+
3
+ Copyright (c) 2025 Pan Min
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in all
13
+ copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
+ SOFTWARE.
package/README.md ADDED
@@ -0,0 +1,115 @@
1
+ # create-vite-react-cli
2
+
3
+ 一个快速创建基于 Vite 的 React 项目的脚手架工具。
4
+
5
+ ## 功能特性
6
+
7
+ - ⚡️ 基于 Vite,极速启动
8
+ - ⚛️ 使用 React 18
9
+ - 🎨 开箱即用的项目模板
10
+ - 📦 自动配置 TypeScript 类型支持
11
+ - 🚀 现代化的开发体验
12
+
13
+ ## 安装
14
+
15
+ ### 全局安装
16
+
17
+ ```bash
18
+ npm install -g create-vite-react-cli
19
+ ```
20
+
21
+ ### 使用 npx(推荐)
22
+
23
+ ```bash
24
+ npx create-vite-react-cli my-app
25
+ ```
26
+
27
+ ## 使用方法
28
+
29
+ ### 基本用法
30
+
31
+ ```bash
32
+ create-vite-react my-app
33
+ ```
34
+
35
+ 或者使用 npx:
36
+
37
+ ```bash
38
+ npx create-vite-react-cli my-app
39
+ ```
40
+
41
+ ### 交互式创建
42
+
43
+ 如果不提供项目名称,工具会提示您输入:
44
+
45
+ ```bash
46
+ create-vite-react
47
+ ```
48
+
49
+ ## 项目结构
50
+
51
+ 创建的项目包含以下结构:
52
+
53
+ ```
54
+ my-app/
55
+ ├── public/
56
+ │ ├── vite.svg
57
+ │ └── react.svg
58
+ ├── src/
59
+ │ ├── App.jsx
60
+ │ ├── App.css
61
+ │ ├── main.jsx
62
+ │ └── index.css
63
+ ├── index.html
64
+ ├── vite.config.js
65
+ ├── package.json
66
+ └── README.md
67
+ ```
68
+
69
+ ## 创建后的步骤
70
+
71
+ 1. 进入项目目录:
72
+ ```bash
73
+ cd my-app
74
+ ```
75
+
76
+ 2. 安装依赖:
77
+ ```bash
78
+ npm install
79
+ ```
80
+
81
+ 3. 启动开发服务器:
82
+ ```bash
83
+ npm run dev
84
+ ```
85
+
86
+ 4. 构建生产版本:
87
+ ```bash
88
+ npm run build
89
+ ```
90
+
91
+ 5. 预览生产构建:
92
+ ```bash
93
+ npm run preview
94
+ ```
95
+
96
+ ## 发布到 npm
97
+
98
+ 1. 确保已登录 npm:
99
+ ```bash
100
+ npm login
101
+ ```
102
+
103
+ 2. 发布包:
104
+ ```bash
105
+ npm publish
106
+ ```
107
+
108
+ ## 许可证
109
+
110
+ MIT
111
+
112
+ ## 作者
113
+
114
+ Pan Min
115
+
package/bin/cli.js ADDED
@@ -0,0 +1,16 @@
1
+ #!/usr/bin/env node
2
+
3
+ const { program } = require('commander');
4
+ const createProject = require('../src/index');
5
+
6
+ program
7
+ .name('create-vite-react-cli')
8
+ .description('快速创建基于 Vite 的 React 项目')
9
+ .version('1.0.1')
10
+ .argument('[project-name]', '项目名称')
11
+ .action((projectName) => {
12
+ createProject(projectName);
13
+ });
14
+
15
+ program.parse();
16
+
package/package.json ADDED
@@ -0,0 +1,45 @@
1
+ {
2
+ "name": "create-vite-react-cli",
3
+ "version": "1.0.1",
4
+ "description": "一个快速创建基于 Vite 的 React 项目的脚手架工具。",
5
+ "main": "index.js",
6
+ "bin": {
7
+ "create-vite-react-cli": "bin/cli.js"
8
+ },
9
+ "files": [
10
+ "bin",
11
+ "src",
12
+ "templates"
13
+ ],
14
+ "engines": {
15
+ "node": ">=14.0.0"
16
+ },
17
+ "scripts": {
18
+ "test": "echo \"Error: no test specified\" && exit 1"
19
+ },
20
+ "repository": {
21
+ "type": "git",
22
+ "url": "git+https://github.com/pm0915/create-vite-react-cli.git"
23
+ },
24
+ "keywords": [
25
+ "vite",
26
+ "react",
27
+ "scaffold",
28
+ "cli",
29
+ "create-react-app",
30
+ "template"
31
+ ],
32
+ "author": "",
33
+ "license": "MIT",
34
+ "bugs": {
35
+ "url": "https://github.com/pm0915/create-vite-react-cli/issues"
36
+ },
37
+ "homepage": "https://github.com/pm0915/create-vite-react-cli#readme",
38
+ "dependencies": {
39
+ "chalk": "^4.1.2",
40
+ "commander": "^9.4.1",
41
+ "fs-extra": "^11.1.1",
42
+ "inquirer": "^8.2.5",
43
+ "ora": "^5.4.1"
44
+ }
45
+ }
package/src/index.js ADDED
@@ -0,0 +1,86 @@
1
+ const fs = require('fs-extra');
2
+ const path = require('path');
3
+ const chalk = require('chalk');
4
+ const ora = require('ora');
5
+ const inquirer = require('inquirer');
6
+
7
+ async function createProject(projectName) {
8
+ try {
9
+ // 如果没有提供项目名称,则询问用户
10
+ if (!projectName) {
11
+ const answer = await inquirer.prompt([
12
+ {
13
+ type: 'input',
14
+ name: 'name',
15
+ message: '请输入项目名称:',
16
+ default: 'my-vite-react-app',
17
+ validate: (input) => {
18
+ if (!input.trim()) {
19
+ return '项目名称不能为空';
20
+ }
21
+ if (!/^[a-z0-9-]+$/.test(input)) {
22
+ return '项目名称只能包含小写字母、数字和连字符';
23
+ }
24
+ return true;
25
+ }
26
+ }
27
+ ]);
28
+ projectName = answer.name;
29
+ }
30
+
31
+ // 验证项目名称格式
32
+ if (!/^[a-z0-9-]+$/.test(projectName)) {
33
+ console.error(chalk.red('错误: 项目名称只能包含小写字母、数字和连字符'));
34
+ process.exit(1);
35
+ }
36
+
37
+ const targetDir = path.resolve(process.cwd(), projectName);
38
+
39
+ // 检查目录是否已存在
40
+ if (await fs.pathExists(targetDir)) {
41
+ const { overwrite } = await inquirer.prompt([
42
+ {
43
+ type: 'confirm',
44
+ name: 'overwrite',
45
+ message: `目录 ${projectName} 已存在,是否覆盖?`,
46
+ default: false
47
+ }
48
+ ]);
49
+
50
+ if (overwrite) {
51
+ await fs.remove(targetDir);
52
+ } else {
53
+ console.log(chalk.yellow('操作已取消'));
54
+ process.exit(0);
55
+ }
56
+ }
57
+
58
+ const spinner = ora('正在创建项目...').start();
59
+
60
+ // 创建项目目录
61
+ await fs.ensureDir(targetDir);
62
+
63
+ // 复制模板文件
64
+ const templateDir = path.join(__dirname, '../templates');
65
+ await fs.copy(templateDir, targetDir);
66
+
67
+ // 读取并更新 package.json
68
+ const packageJsonPath = path.join(targetDir, 'package.json');
69
+ const packageJson = await fs.readJson(packageJsonPath);
70
+ packageJson.name = projectName;
71
+ await fs.writeJson(packageJsonPath, packageJson, { spaces: 2 });
72
+
73
+ spinner.succeed('项目创建成功!');
74
+
75
+ console.log(chalk.green('\n下一步:'));
76
+ console.log(chalk.cyan(` cd ${projectName}`));
77
+ console.log(chalk.cyan(' npm install'));
78
+ console.log(chalk.cyan(' npm run dev\n'));
79
+ } catch (error) {
80
+ console.error(chalk.red('创建项目时出错:'), error.message);
81
+ process.exit(1);
82
+ }
83
+ }
84
+
85
+ module.exports = createProject;
86
+
@@ -0,0 +1,35 @@
1
+ # React + Vite
2
+
3
+ 这是一个使用 [Vite](https://vitejs.dev/) 创建的 React 项目模板。
4
+
5
+ ## 开始使用
6
+
7
+ ### 安装依赖
8
+
9
+ ```bash
10
+ npm install
11
+ ```
12
+
13
+ ### 开发
14
+
15
+ ```bash
16
+ npm run dev
17
+ ```
18
+
19
+ ### 构建
20
+
21
+ ```bash
22
+ npm run build
23
+ ```
24
+
25
+ ### 预览生产构建
26
+
27
+ ```bash
28
+ npm run preview
29
+ ```
30
+
31
+ ## 了解更多
32
+
33
+ - [React 文档](https://react.dev/)
34
+ - [Vite 文档](https://vitejs.dev/)
35
+
@@ -0,0 +1,14 @@
1
+ <!doctype html>
2
+ <html lang="zh-CN">
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 + React</title>
8
+ </head>
9
+ <body>
10
+ <div id="root"></div>
11
+ <script type="module" src="/src/main.jsx"></script>
12
+ </body>
13
+ </html>
14
+
@@ -0,0 +1,22 @@
1
+ {
2
+ "name": "my-vite-react-app",
3
+ "private": true,
4
+ "version": "0.0.0",
5
+ "type": "module",
6
+ "scripts": {
7
+ "dev": "vite",
8
+ "build": "vite build",
9
+ "preview": "vite preview"
10
+ },
11
+ "dependencies": {
12
+ "react": "^18.2.0",
13
+ "react-dom": "^18.2.0"
14
+ },
15
+ "devDependencies": {
16
+ "@types/react": "^18.2.43",
17
+ "@types/react-dom": "^18.2.17",
18
+ "@vitejs/plugin-react": "^4.2.1",
19
+ "vite": "^5.0.8"
20
+ }
21
+ }
22
+
@@ -0,0 +1,2 @@
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="35.93" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 228"><path fill="#00D8FF" d="M210.483 73.824a171.49 171.49 0 0 0-11.283-12.978c-.404-.466-.827-.928-1.238-1.4c-7.464-8.563-15.868-15.939-24.959-22.256a9.87 9.87 0 0 0-2.422-1.005a128.22 128.22 0 0 0-9.276-2.756a132.952 132.952 0 0 0-20.177-2.729a9.9 9.9 0 0 0-1.15-.04H128.01c-1.4.015-2.8.04-4.19.13c-6.97.38-13.88 1.23-20.65 2.55a9.95 9.95 0 0 0-1.87.48c-3.12.75-6.19 1.63-9.2 2.65a9.85 9.85 0 0 0-1.72.73a115.388 115.388 0 0 0-9.12 4.54a134.838 134.838 0 0 0-25.037 22.19a9.98 9.98 0 0 0-1.13 1.28a145.227 145.227 0 0 0-11.16 12.94a125.876 125.876 0 0 0-7.35 10.48a156.152 156.152 0 0 0-9.07 17.15c-.25.52-.48 1.05-.71 1.58a114.27 114.27 0 0 0-5.13 14.88a9.97 9.97 0 0 0-.28 1.16a125.67 125.67 0 0 0-3.18 15.75a9.94 9.94 0 0 0-.08 1.22v.66a132.52 132.52 0 0 0-.17 13.16a9.9 9.9 0 0 0 .08 1.22c.33 2.62.75 5.22 1.26 7.8a9.97 9.97 0 0 0 .28 1.16c.95 3.88 2.05 7.72 3.28 11.52c.23.53.46 1.06.71 1.58a156.152 156.152 0 0 0 9.07 17.15c1.55 2.8 3.2 5.55 4.93 8.25a125.876 125.876 0 0 0 7.35 10.48a145.227 145.227 0 0 0 11.16 12.94a9.98 9.98 0 0 0 1.13 1.28a134.838 134.838 0 0 0 25.037 22.19a115.388 115.388 0 0 0 9.12 4.54a9.85 9.85 0 0 0 1.72.73c2.95.98 5.97 1.84 9.03 2.56a9.95 9.95 0 0 0 1.87.48c6.77 1.32 13.68 2.17 20.65 2.55c1.39.09 2.79.12 4.19.13h1.93c1.4-.015 2.8-.04 4.19-.13c6.97-.38 13.88-1.23 20.65-2.55a9.95 9.95 0 0 0 1.87-.48c3.06-.72 6.08-1.58 9.03-2.56a9.85 9.85 0 0 0 1.72-.73a115.388 115.388 0 0 0 9.12-4.54a134.838 134.838 0 0 0 25.037-22.19a9.98 9.98 0 0 0 1.13-1.28a145.227 145.227 0 0 0 11.16-12.94c1.73-2.7 3.38-5.45 4.93-8.25a156.152 156.152 0 0 0 9.07-17.15c.25-.52.48-1.05.71-1.58a114.27 114.27 0 0 0 5.13-14.88a9.97 9.97 0 0 0 .28-1.16c.51-2.58.93-5.18 1.26-7.8a9.9 9.9 0 0 0 .08-1.22v-.66a132.52 132.52 0 0 0-.17-13.16a9.9 9.9 0 0 0-.08-1.22c-.33-2.62-.75-5.22-1.26-7.8a9.97 9.97 0 0 0-.28-1.16a114.27 114.27 0 0 0-5.13-14.88c-.23-.53-.46-1.06-.71-1.58a156.152 156.152 0 0 0-9.07-17.15a125.876 125.876 0 0 0-7.35-10.48Zm-5.376 20.45c.2.42.4.85.59 1.28c1.55 3.4 2.98 6.86 4.27 10.37c.08.22.16.44.23.66c1.15 3.23 2.2 6.5 3.13 9.8c.05.18.1.36.15.54c.7 2.55 1.35 5.12 1.93 7.7c.03.13.06.26.09.39c.52 2.3.98 4.62 1.38 6.95c.02.12.04.24.06.36c.35 2.05.66 4.11.92 6.18c.01.1.02.2.03.3c.22 1.78.4 3.57.54 5.36c.01.12.02.24.03.36c.1 1.5.18 3 .23 4.5c0 .08 0 .16.01.24c.03 1.1.05 2.2.05 3.3c0 .37 0 .74-.01 1.11c0 .55-.02 1.1-.04 1.65c-.01.24-.02.48-.04.72c-.05 1.5-.13 3-.23 4.5c-.01.12-.02.24-.03.36c-.14 1.79-.32 3.58-.54 5.36c-.01.1-.02.2-.03.3c-.26 2.07-.57 4.13-.92 6.18c-.02.12-.04.24-.06.36c-.4 2.33-.86 4.65-1.38 6.95c-.03.13-.06.26-.09.39c-.58 2.58-1.23 5.15-1.93 7.7c-.05.18-.1.36-.15.54c-.93 3.3-1.98 6.57-3.13 9.8c-.07.22-.15.44-.23.66c-1.29 3.51-2.72 6.97-4.27 10.37c-.19.43-.39.86-.59 1.28a134.376 134.376 0 0 1-8.89 15.48a115.22 115.22 0 0 1-6.15 8.88a125.3 125.3 0 0 1-9.78 11.2a115.5 115.5 0 0 1-8.56 8.12a134.7 134.7 0 0 1-22.12 16.12a115.4 115.4 0 0 1-7.84 4.1a125.4 125.4 0 0 1-17.15 6.12a115.5 115.5 0 0 1-8.88 2.12a134.7 134.7 0 0 1-24.75 2.3c-.46 0-.92-.01-1.38-.02c-3.3-.08-6.58-.3-9.83-.66a115.5 115.5 0 0 1-8.88-2.12a125.4 125.4 0 0 1-17.15-6.12a115.4 115.4 0 0 1-7.84-4.1a134.7 134.7 0 0 1-22.12-16.12a115.5 115.5 0 0 1-8.56-8.12a125.3 125.3 0 0 1-9.78-11.2a115.22 115.22 0 0 1-6.15-8.88a134.376 134.376 0 0 1-8.89-15.48c-.2-.42-.4-.85-.59-1.28c-1.55-3.4-2.98-6.86-4.27-10.37a115.22 115.22 0 0 1-.23-.66c-1.15-3.23-2.2-6.5-3.13-9.8a125.3 125.3 0 0 1-.15-.54c-.7-2.55-1.35-5.12-1.93-7.7a115.5 115.5 0 0 1-.09-.39c-.52-2.3-.98-4.62-1.38-6.95a134.7 134.7 0 0 1-.06-.36c-.35-2.05-.66-4.11-.92-6.18a115.4 115.4 0 0 1-.03-.3c-.22-1.78-.4-3.57-.54-5.36a125.4 125.4 0 0 1-.03-.36c-.1-1.5-.18-3-.23-4.5a115.5 115.5 0 0 1-.04-.72c-.02-.55-.04-1.1-.04-1.65c0-.37 0-.74-.01-1.11c0-1.1-.02-2.2-.05-3.3a134.7 134.7 0 0 1-.01-.24c-.05-1.5-.13-3-.23-4.5c-.01-.12-.02-.24-.03-.36c-.14-1.79-.32-3.58-.54-5.36c-.01-.1-.02-.2-.03-.3c-.26-2.07-.57-4.13-.92-6.18c-.02-.12-.04-.24-.06-.36c-.4-2.33-.86-4.65-1.38-6.95c-.03-.13-.06-.26-.09-.39c-.58-2.58-1.23-5.15-1.93-7.7c-.05-.18-.1-.36-.15-.54c-.93-3.3-1.98-6.57-3.13-9.8c-.07-.22-.15-.44-.23-.66c1.29-3.51 2.72-6.97 4.27-10.37c.19-.43.39-.86.59-1.28a134.376 134.376 0 0 1 8.89-15.48a115.22 115.22 0 0 1 6.15-8.88a125.3 125.3 0 0 1 9.78-11.2a115.5 115.5 0 0 1 8.56-8.12a134.7 134.7 0 0 1 22.12-16.12a115.4 115.4 0 0 1 7.84-4.1a125.4 125.4 0 0 1 17.15-6.12a115.5 115.5 0 0 1 8.88-2.12a134.7 134.7 0 0 1 24.75-2.3c.46 0 .92.01 1.38.02c3.3.08 6.58.3 9.83.66a115.5 115.5 0 0 1 8.88 2.12a125.4 125.4 0 0 1 17.15 6.12a115.4 115.4 0 0 1 7.84 4.1a134.7 134.7 0 0 1 22.12 16.12a115.5 115.5 0 0 1 8.56 8.12a125.3 125.3 0 0 1 9.78 11.2a115.22 115.22 0 0 1 6.15 8.88a134.376 134.376 0 0 1 8.89 15.48Z"></path><path fill="#00D8FF" d="M210.483 73.824a171.49 171.49 0 0 0-11.283-12.978c-.404-.466-.827-.928-1.238-1.4c-7.464-8.563-15.868-15.939-24.959-22.256a9.87 9.87 0 0 0-2.422-1.005a128.22 128.22 0 0 0-9.276-2.756a132.952 132.952 0 0 0-20.177-2.729a9.9 9.9 0 0 0-1.15-.04H128.01c-1.4.015-2.8.04-4.19.13c-6.97.38-13.88 1.23-20.65 2.55a9.95 9.95 0 0 0-1.87.48c-3.12.75-6.19 1.63-9.2 2.65a9.85 9.85 0 0 0-1.72.73a115.388 115.388 0 0 0-9.12 4.54a134.838 134.838 0 0 0-25.037 22.19a9.98 9.98 0 0 0-1.13 1.28a145.227 145.227 0 0 0-11.16 12.94a125.876 125.876 0 0 0-7.35 10.48a156.152 156.152 0 0 0-9.07 17.15c-.25.52-.48 1.05-.71 1.58a114.27 114.27 0 0 0-5.13 14.88a9.97 9.97 0 0 0-.28 1.16a125.67 125.67 0 0 0-3.18 15.75a9.94 9.94 0 0 0-.08 1.22v.66a132.52 132.52 0 0 0-.17 13.16a9.9 9.9 0 0 0 .08 1.22c.33 2.62.75 5.22 1.26 7.8a9.97 9.97 0 0 0 .28 1.16c.95 3.88 2.05 7.72 3.28 11.52c.23.53.46 1.06.71 1.58a156.152 156.152 0 0 0 9.07 17.15c1.55 2.8 3.2 5.55 4.93 8.25a125.876 125.876 0 0 0 7.35 10.48a145.227 145.227 0 0 0 11.16 12.94a9.98 9.98 0 0 0 1.13 1.28a134.838 134.838 0 0 0 25.037 22.19a115.388 115.388 0 0 0 9.12 4.54a9.85 9.85 0 0 0 1.72.73c2.95.98 5.97 1.84 9.03 2.56a9.95 9.95 0 0 0 1.87.48c6.77 1.32 13.68 2.17 20.65 2.55c1.39.09 2.79.12 4.19.13h1.93c1.4-.015 2.8-.04 4.19-.13c6.97-.38 13.88-1.23 20.65-2.55a9.95 9.95 0 0 0 1.87-.48c3.06-.72 6.08-1.58 9.03-2.56a9.85 9.85 0 0 0 1.72-.73a115.388 115.388 0 0 0 9.12-4.54a134.838 134.838 0 0 0 25.037-22.19a9.98 9.98 0 0 0 1.13-1.28a145.227 145.227 0 0 0 11.16-12.94c1.73-2.7 3.38-5.45 4.93-8.25a156.152 156.152 0 0 0 9.07-17.15c.25-.52.48-1.05.71-1.58a114.27 114.27 0 0 0 5.13-14.88a9.97 9.97 0 0 0 .28-1.16c.51-2.58.93-5.18 1.26-7.8a9.9 9.9 0 0 0 .08-1.22v-.66a132.52 132.52 0 0 0-.17-13.16a9.9 9.9 0 0 0-.08-1.22c-.33-2.62-.75-5.22-1.26-7.8a9.97 9.97 0 0 0-.28-1.16a114.27 114.27 0 0 0-5.13-14.88c-.23-.53-.46-1.06-.71-1.58a156.152 156.152 0 0 0-9.07-17.15a125.876 125.876 0 0 0-7.35-10.48Zm-5.376 20.45c.2.42.4.85.59 1.28c1.55 3.4 2.98 6.86 4.27 10.37c.08.22.16.44.23.66c1.15 3.23 2.2 6.5 3.13 9.8c.05.18.1.36.15.54c.7 2.55 1.35 5.12 1.93 7.7c.03.13.06.26.09.39c.52 2.3.98 4.62 1.38 6.95c.02.12.04.24.06.36c.35 2.05.66 4.11.92 6.18c.01.1.02.2.03.3c.22 1.78.4 3.57.54 5.36c.01.12.02.24.03.36c.1 1.5.18 3 .23 4.5c0 .08 0 .16.01.24c.03 1.1.05 2.2.05 3.3c0 .37 0 .74-.01 1.11c0 .55-.02 1.1-.04 1.65c-.01.24-.02.48-.04.72c-.05 1.5-.13 3-.23 4.5c-.01.12-.02.24-.03.36c-.14 1.79-.32 3.58-.54 5.36c-.01.1-.02.2-.03.3c-.26 2.07-.57 4.13-.92 6.18c-.02.12-.04.24-.06.36c-.4 2.33-.86 4.65-1.38 6.95c-.03.13-.06.26-.09.39c-.58 2.58-1.23 5.15-1.93 7.7c-.05.18-.1.36-.15.54c-.93 3.3-1.98 6.57-3.13 9.8c-.07.22-.15.44-.23.66c-1.29 3.51-2.72 6.97-4.27 10.37c-.19.43-.39.86-.59 1.28a134.376 134.376 0 0 1-8.89 15.48a115.22 115.22 0 0 1-6.15 8.88a125.3 125.3 0 0 1-9.78 11.2a115.5 115.5 0 0 1-8.56 8.12a134.7 134.7 0 0 1-22.12 16.12a115.4 115.4 0 0 1-7.84 4.1a125.4 125.4 0 0 1-17.15 6.12a115.5 115.5 0 0 1-8.88 2.12a134.7 134.7 0 0 1-24.75 2.3c-.46 0-.92-.01-1.38-.02c-3.3-.08-6.58-.3-9.83-.66a115.5 115.5 0 0 1-8.88-2.12a125.4 125.4 0 0 1-17.15-6.12a115.4 115.4 0 0 1-7.84-4.1a134.7 134.7 0 0 1-22.12-16.12a115.5 115.5 0 0 1-8.56-8.12a125.3 125.3 0 0 1-9.78-11.2a115.22 115.22 0 0 1-6.15-8.88a134.376 134.376 0 0 1-8.89-15.48c-.2-.42-.4-.85-.59-1.28c-1.55-3.4-2.98-6.86-4.27-10.37a115.22 115.22 0 0 1-.23-.66c-1.15-3.23-2.2-6.5-3.13-9.8a125.3 125.3 0 0 1-.15-.54c-.7-2.55-1.35-5.12-1.93-7.7a115.5 115.5 0 0 1-.09-.39c-.52-2.3-.98-4.62-1.38-6.95a134.7 134.7 0 0 1-.06-.36c-.35-2.05-.66-4.11-.92-6.18a115.4 115.4 0 0 1-.03-.3c-.22-1.78-.4-3.57-.54-5.36a125.4 125.4 0 0 1-.03-.36c-.1-1.5-.18-3-.23-4.5a115.5 115.5 0 0 1-.04-.72c-.02-.55-.04-1.1-.04-1.65c0-.37 0-.74-.01-1.11c0-1.1-.02-2.2-.05-3.3a134.7 134.7 0 0 1-.01-.24c-.05-1.5-.13-3-.23-4.5c-.01-.12-.02-.24-.03-.36c-.14-1.79-.32-3.58-.54-5.36c-.01-.1-.02-.2-.03-.3c-.26-2.07-.57-4.13-.92-6.18c-.02-.12-.04-.24-.06-.36c-.4-2.33-.86-4.65-1.38-6.95c-.03-.13-.06-.26-.09-.39c-.58-2.58-1.23-5.15-1.93-7.7c-.05-.18-.1-.36-.15-.54c-.93-3.3-1.98-6.57-3.13-9.8c-.07-.22-.15-.44-.23-.66c1.29-3.51 2.72-6.97 4.27-10.37c.19-.43.39-.86.59-1.28a134.376 134.376 0 0 1 8.89-15.48a115.22 115.22 0 0 1 6.15-8.88a125.3 125.3 0 0 1 9.78-11.2a115.5 115.5 0 0 1 8.56-8.12a134.7 134.7 0 0 1 22.12-16.12a115.4 115.4 0 0 1 7.84-4.1a125.4 125.4 0 0 1 17.15-6.12a115.5 115.5 0 0 1 8.88-2.12a134.7 134.7 0 0 1 24.75-2.3c.46 0 .92.01 1.38.02c3.3.08 6.58.3 9.83.66a115.5 115.5 0 0 1 8.88 2.12a125.4 125.4 0 0 1 17.15 6.12a115.4 115.4 0 0 1 7.84 4.1a134.7 134.7 0 0 1 22.12 16.12a115.5 115.5 0 0 1 8.56 8.12a125.3 125.3 0 0 1 9.78 11.2a115.22 115.22 0 0 1 6.15 8.88a134.376 134.376 0 0 1 8.89 15.48Z"></path></svg>
2
+
@@ -0,0 +1,2 @@
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>
2
+
@@ -0,0 +1,43 @@
1
+ #root {
2
+ max-width: 1280px;
3
+ margin: 0 auto;
4
+ padding: 2rem;
5
+ text-align: center;
6
+ }
7
+
8
+ .logo {
9
+ height: 6em;
10
+ padding: 1.5em;
11
+ will-change: filter;
12
+ transition: filter 300ms;
13
+ }
14
+ .logo:hover {
15
+ filter: drop-shadow(0 0 2em #646cffaa);
16
+ }
17
+ .logo.react:hover {
18
+ filter: drop-shadow(0 0 2em #61dafbaa);
19
+ }
20
+
21
+ @keyframes logo-spin {
22
+ from {
23
+ transform: rotate(0deg);
24
+ }
25
+ to {
26
+ transform: rotate(360deg);
27
+ }
28
+ }
29
+
30
+ @media (prefers-reduced-motion: no-preference) {
31
+ a:nth-of-type(2) .logo {
32
+ animation: logo-spin infinite 20s linear;
33
+ }
34
+ }
35
+
36
+ .card {
37
+ padding: 2em;
38
+ }
39
+
40
+ .read-the-docs {
41
+ color: #888;
42
+ }
43
+
@@ -0,0 +1,34 @@
1
+ import { useState } from 'react'
2
+ import './App.css'
3
+
4
+ function App() {
5
+ const [count, setCount] = useState(0)
6
+
7
+ return (
8
+ <div className="App">
9
+ <div>
10
+ <a href="https://vitejs.dev" target="_blank" rel="noopener noreferrer">
11
+ <img src="/vite.svg" className="logo" alt="Vite logo" />
12
+ </a>
13
+ <a href="https://react.dev" target="_blank" rel="noopener noreferrer">
14
+ <img src="/react.svg" className="logo react" alt="React logo" />
15
+ </a>
16
+ </div>
17
+ <h1>Vite + React</h1>
18
+ <div className="card">
19
+ <button onClick={() => setCount((count) => count + 1)}>
20
+ 计数是 {count}
21
+ </button>
22
+ <p>
23
+ 编辑 <code>src/App.jsx</code> 并保存以测试 HMR
24
+ </p>
25
+ </div>
26
+ <p className="read-the-docs">
27
+ 点击 Vite 和 React 的 logo 了解更多信息
28
+ </p>
29
+ </div>
30
+ )
31
+ }
32
+
33
+ export default App
34
+
@@ -0,0 +1,69 @@
1
+ :root {
2
+ font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
3
+ line-height: 1.5;
4
+ font-weight: 400;
5
+
6
+ color-scheme: light dark;
7
+ color: rgba(255, 255, 255, 0.87);
8
+ background-color: #242424;
9
+
10
+ font-synthesis: none;
11
+ text-rendering: optimizeLegibility;
12
+ -webkit-font-smoothing: antialiased;
13
+ -moz-osx-font-smoothing: grayscale;
14
+ }
15
+
16
+ a {
17
+ font-weight: 500;
18
+ color: #646cff;
19
+ text-decoration: inherit;
20
+ }
21
+ a:hover {
22
+ color: #535bf2;
23
+ }
24
+
25
+ body {
26
+ margin: 0;
27
+ display: flex;
28
+ place-items: center;
29
+ min-width: 320px;
30
+ min-height: 100vh;
31
+ }
32
+
33
+ h1 {
34
+ font-size: 3.2em;
35
+ line-height: 1.1;
36
+ }
37
+
38
+ button {
39
+ border-radius: 8px;
40
+ border: 1px solid transparent;
41
+ padding: 0.6em 1.2em;
42
+ font-size: 1em;
43
+ font-weight: 500;
44
+ font-family: inherit;
45
+ background-color: #1a1a1a;
46
+ cursor: pointer;
47
+ transition: border-color 0.25s;
48
+ }
49
+ button:hover {
50
+ border-color: #646cff;
51
+ }
52
+ button:focus,
53
+ button:focus-visible {
54
+ outline: 4px auto -webkit-focus-ring-color;
55
+ }
56
+
57
+ @media (prefers-color-scheme: light) {
58
+ :root {
59
+ color: #213547;
60
+ background-color: #ffffff;
61
+ }
62
+ a:hover {
63
+ color: #747bff;
64
+ }
65
+ button {
66
+ background-color: #f9f9f9;
67
+ }
68
+ }
69
+
@@ -0,0 +1,11 @@
1
+ import React from 'react'
2
+ import ReactDOM from 'react-dom/client'
3
+ import App from './App.jsx'
4
+ import './index.css'
5
+
6
+ ReactDOM.createRoot(document.getElementById('root')).render(
7
+ <React.StrictMode>
8
+ <App />
9
+ </React.StrictMode>,
10
+ )
11
+
@@ -0,0 +1,8 @@
1
+ import { defineConfig } from 'vite'
2
+ import react from '@vitejs/plugin-react'
3
+
4
+ // https://vitejs.dev/config/
5
+ export default defineConfig({
6
+ plugins: [react()],
7
+ })
8
+