## 一、Vue介紹 Vue (讀音 /vju?/，類似于 **view**) 是一套用于構建用戶界面的**漸進式框架**。與其它大型框架不同的是，Vue 被設計為可以自底向上逐層應用。Vue 的核心庫只關注視圖層，不僅易于上手，還便于與第三方庫或既有項目整合。目前最新版本是Vue3.x。 Vue3.x發布于2020年9月19日，在Vue2.x的基礎上面進行了一些優化，對TypeScript有更好的支持。Vue3.x的語法和Vue2.x非常相似，如果你已經會用Vue2.x，那么學Vue3.x會非常簡單。 **Vue 官網地址**：[https://cn.vuejs.org/](https://cn.vuejs.org/) **Vue3.x Githtub地址:** [https://github.com/vuejs/vue-next](https://github.com/vuejs/vue-next) **Vue3.x 文檔地址:** [https://v3.vuejs.org/](https://v3.vuejs.org/) **Vue3.x 中文文檔地址**：[https://v3.cn.vuejs.org/](https://v3.cn.vuejs.org/) ## 二、安裝Vue官方腳手架以及創建項目 **注意:** 安裝腳手架創建項目之前之前，我們的電腦上必須得安裝Nodejs，推薦安裝nodejs穩定版本 **文檔地址：** [https://v3.vuejs.org/guide/installation.html#cli](https://v3.vuejs.org/guide/installation.html#cli) **Vue-cli地址：** [https://cli.vuejs.org/](https://cli.vuejs.org/) **Vite地址：** [https://github.com/vitejs/vite](https://github.com/vitejs/vite) 通過Vue-cli腳手架工具可以讓我們快速的搭建vue項目，目前Vue官方給我們提供了2個腳手架，Vue-cli和Vite。 #### 一、通過Vue-cli創建我們的項目 **1.1、安裝Vue-cli，在同一個電腦上面只需要安裝一次** ~~~ yarn global add @vue/cli # OR npm install -g @vue/cli # OR cnpm install -g @vue/cli ~~~ 如果電腦上面沒有安裝過cnpm可以通過下面命令安裝： ~~~ npm install -g cnpm --registry=https://registry.npm.taobao.org ~~~ 如果電腦上面沒有安裝過yarn可以通過下面命令安裝： ~~~ npm i -g yarn ~~~ **1.2、通過Vue-cli創建項目** ~~~ vue create hello-vue3 yarn serve ~~~ #### 二、通過Vite腳手架創建我們的項目 **2.1、使用npm創建** ~~~ npm init vite-app <project-name> cd <project-name> npm install npm run dev ~~~ **2.2、使用yarn創建** ~~~ yarn create vite-app <project-name> cd <project-name> yarn yarn dev ~~~ ## 三、目錄結構介紹  ### 四、開發工具以及插件配置