Vue分享

网站地址:https://cn.vuejs.org/

GitHub:https://github.com/vuejs/vue

网站描述:Vue.js是一套构建用户界面的渐进式JavaScript框架

工具链以及各种支持类库结合使用时，Vue 也完全能够为复杂的单页应用提供驱动。

Vue的特点

1、易用

已经会了 html、css、JavaScript？即刻阅读指南开始构建应用！

2、灵活

不断繁荣的生态系统，可以在一个库和一套完整框架之间自如伸缩。

3、高效

20kB min+gzip 运行大小
超快虚拟 dom 
最省心的优化

Vue的安装

Vue.js 设计的初衷就包括可以被渐进式地采用。这意味着它可以根据需求以多种方式集成到一个项目中。将 Vue.js 添加到项目中主要有四种方式：

在页面上以 CDN 包的形式导入。
下载 JavaScript 文件并自行托管。
使用 npm 安装它。
使用官方的 CLI 来构建一个项目，它为现代前端工作流程提供了功能齐备的构建设置 (例如，热重载、保存时的提示等等)。

vue-cli安装

Vue.js 提供一个官方命令行工具，可用于快速搭建大型单页应用： 

//全局安装 vue-cli
npm install --global vue-cli
//创建一个基于 webpack 模板的新项目
vue init webpack my-project
//这里需要进行一些配置，默认回车即可

进入项目，安装并运行：  

cd my-project
npm install
npm run dev

对于 Vue 3，你应该使用 npm 上可用的 Vue CLI v4.5 作为 @vue/cli。要升级，你应该需要全局重新安装最新版本的 @vue/cli：

yarn global add @vue/cli
# 或
npm install -g @vue/cli

然后在 Vue 项目中运行：

vue upgrade --next

Vite

Vite 是一个 web 开发构建工具，由于其原生 ES 模块导入方式，可以实现闪电般的冷服务器启动。
通过在终端中运行以下命令，可以使用 Vite 快速构建 Vue 项目。
使用 npm：

# npm 6.x
$ npm init vite@latest <project-name> --template vue

# npm 7+，需要加上额外的双短横线
$ npm init vite@latest <project-name> -- --template vue

$ cd <project-name>
$ npm install
$ npm run dev

或者 yarn：

$ yarn create vite <project-name> --template vue
$ cd <project-name>
$ yarn
$ yarn dev