创建一个 Vue 应用 & 了解vue

1

npm create vue@latest

默认目录结构

vscode环境安装

第一个项目

删除无用文件，重新改下App.vue和router/index.js里面的内容

了解main.js

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14

import './assets/main.css'

import { createApp } from 'vue'
import { createPinia } from 'pinia'

import App from './App.vue'
import router from './router'

const app = createApp(App)

app.use(createPinia())
app.use(router)

app.mount('#app')

每个 Vue 应用都是通过 createApp 函数创建一个新的 应用实例：

根组件

我们传入 createApp 的对象实际上是一个组件，每个应用都需要一个“根组件”，其他组件将作为其子组件。

挂载应用

应用实例必须在调用了 .mount() 方法后才会渲染出来。该方法接收一个“容器”参数，可以是一个实际的 DOM 元素或是一个 CSS 选择器字符串：

app.mount('#app')