diff --git a/README.md b/README.md index 6393dd38a09acab477f5c072e7d3f7c2f4d95dc7..ca8b46e0490dd1dd5f7030e6dae65719be3567ad 100644 --- a/README.md +++ b/README.md @@ -1,38 +1,57 @@ # hello_vue3 -This template should help get you started developing with Vue 3 in Vite. +这是一个基于 Vue 3 和 Vite 的项目模板,可以帮助你快速开始开发现代前端应用。 -## Recommended IDE Setup +## 推荐的 IDE 设置 -[VS Code](https://code.visualstudio.com/) + [Vue (Official)](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur). +- [VS Code](https://code.visualstudio.com/) +- 安装扩展:[Vue (官方)](https://marketplace.visualstudio.com/items?itemName=Vue.volar),并禁用 Vetur。 -## Recommended Browser Setup +## 推荐的浏览器设置 -- Chromium-based browsers (Chrome, Edge, Brave, etc.): - - [Vue.js devtools](https://chromewebstore.google.com/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd) - - [Turn on Custom Object Formatter in Chrome DevTools](http://bit.ly/object-formatters) -- Firefox: - - [Vue.js devtools](https://addons.mozilla.org/en-US/firefox/addon/vue-js-devtools/) - - [Turn on Custom Object Formatter in Firefox DevTools](https://fxdx.dev/firefox-devtools-custom-object-formatters/) +- 基于 Chromium 的浏览器(Chrome、Edge、Brave 等): + - 安装 [Vue.js devtools](https://chromewebstore.google.com/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd) + - 启用 [Custom Object Formatter](http://bit.ly/object-formatters) 以获得更好的调试体验 +- Firefox: + - 安装 [Vue.js devtools](https://addons.mozilla.org/en-US/firefox/addon/vue-js-devtools/) + - 启用 [Custom Object Formatter](https://fxdx.dev/firefox-devtools-custom-object-formatters/) -## Customize configuration +## 自定义配置 -See [Vite Configuration Reference](https://vite.dev/config/). +更多配置选项请参考 [Vite 配置文档](https://vite.dev/config/)。 -## Project Setup +## 项目设置 -```sh +### 安装依赖 + +```bash npm install ``` -### Compile and Hot-Reload for Development +### 启动开发服务器 -```sh +```bash npm run dev ``` -### Compile and Minify for Production +此命令将启动一个带有热重载功能的本地开发服务器。 + +### 构建生产版本 -```sh +```bash npm run build ``` + +此命令将对项目进行打包和压缩,适用于生产环境部署。 + +## 项目结构概览 + +- `index.html`:项目的主 HTML 文件。 +- `src/main.js`:应用的入口文件。 +- `src/App.vue`:根 Vue 组件。 +- `src/components/`:包含项目中使用的 Vue 组件。 +- `src/assets/`:静态资源文件,如 CSS、图片等。 +- `vite.config.js`:Vite 的配置文件。 +- `package.json`:包含项目依赖和脚本配置。 + +本项目使用 Vue 3 的组合式 API 和 Vite 构建工具,适合用于现代 Web 应用开发。欢迎根据需求自由扩展和调整配置! \ No newline at end of file