前言
一般一个真正完整的vue全家桶包括Node.js、Webpack、Axios、Vue-Route、Vuex、ElementUI(其他UI框架也行,如:Ant design of vue)、Vue-Cli。
咱们先简单聊一聊这些技术,后续再进行详细的探讨。
Node.js:
Node.js 就是运行在服务端的 JavaScript。
Node.js 是一个基于Chrome JavaScript 运行时建立的一个平台
详细安装教程可以参照(入口),安装完成后可以在Windows 命令提示符输入命令查看版本号。
Webpack:
Webpack 是一个前端资源加载/打包工具。它将根据模块的依赖关系进行静态分析,然后将这些模块按照指定的规则生成对应的静态资源。
在安装 Webpack 前,你本地环境需要支持 node.js。
在vue全家桶配置时,可在终端或者Windows 命令提示符输入名列进行安装。
cnpm install webpack -g
Axios:
axios是基于promise(诺言)用于浏览器和node.js是http客户端,axios主要是用于向后台发起请求的,还有在请求中做更多是可控功能。想要了解更多可以查看该文档(入口)。
Vue-Route:
Vue Router 是Vue.js 官方的路由管理器。它和 Vue.js 的核心深度集成,让构建单页面应用变得易如反掌。
Vuex:
Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式,简单来说就是当你组件比较多,而且组件之间通信比较频繁时就可以使用vuex来进行管理。
Vue-Cli:
Vue CLI (脚手架)是一个基于 Vue.js 进行快速开发的完整系统,我们所说的vue全家桶是基于vue-cli来进行开发的。
具体搭建过程:
按照以下步骤进行安装,我这边使用了淘宝镜像,npm和cnpm都可以,但npm可能因为网络原因报错。
npm install cnpm -g --registry=https://registry.npm.taobao.org
cnpm install -g vue-cli
vue init webpack
cnpm install
npm run dev
以上步骤都完成了且没有报错的话,脚手架就已经搭建好了。就可以开始下一步了,项目的创建以及开发。
今天只是对vue全家桶进行简单的介绍,要想深入了解并掌握还需要多去看看官方的文档,里面都有着详细的介绍。今天就到这里了,后面会继续更新,大家和我一起深入了解vue全家桶。