vue3初始化项目

作者：暗夜骑士发布日期:2026-07-12 浏览:22
// 创建 Vue 3 项目的基本步骤

// 1. 确保你已经安装了 Node.js 和 npm
// 2. 使用 Vue CLI 创建一个新的 Vue 3 项目

// 打开终端并运行以下命令：
// 安装 Vue CLI（如果还没有安装）
npm install -g @vue/cli

// 创建一个新项目
vue create my-vue3-project

// 进入项目目录
cd my-vue3-project

// 启动开发服务器
npm run serve

// 以下是创建 Vue 3 项目的示例代码，位于 `src/main.js` 文件中：

import { createApp } from 'vue'
import App from './App.vue'

createApp(App).mount('#app')

// 解释说明：
// 1. `createApp` 是 Vue 3 中用于创建应用实例的函数。
// 2. `App.vue` 是项目的根组件。
// 3. `mount('#app')` 将应用挂载到 HTML 中带有 id="app" 的元素上。

// 在 `public/index.html` 文件中，你会看到如下代码：

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <title>my-vue3-project</title>
  </head>
  <body>
    <div id="app"></div>
  </body>
</html>

// 解释说明：
// 1. `<div id="app"></div>` 是 Vue 应用将要挂载的目标元素。
// 2. 其他元数据和标题可以根据需要进行修改。
上一篇：vite 创建vue3项目
下一篇：vue3 router.beforeeach