Vue相关概念介绍

目录

Vue全家桶

Vue-cli

VueRouter

Vuex

Axios

搭配UI框架

iview

elementUI

vant

术语

ECMAScript标准

ES Modules

软件工具

Babel

Webpack

Rollup

Node.js

npm

---

Vue全家桶

Vue-cli

vue-cli也叫脚手架，官方定义为Vue.js开发的标准工具。

VueRouter

Vue.js官方的路由管理器，让构建单页面应用变得很简单。

Vuex

Vuex是一个专门为Vue.js应用程序开发的状态管理模式，它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。

Vuex也集成到Vue的官方调试工具devtools extension，提供了诸如零配置的time-travel调试、状态快照导入导出等高级调试功能。

如果应用很简单，那么不适合用Vuex。

Axios

Axios是一个基于promise的HTTP库，可以用在浏览器和node.js中。

客户端支持防御XSRF。

搭配UI框架

iview

一套基于Vue的高质量UI组件库，分为小程序和PC端等不同版本。

可以用iview-admin框架搭建管理后台程序。

elementUI

基于Vue 2.0桌面端的后台组件库。

vant

轻量、可靠的移动端Vue组件库。

术语

ECMAScript标准

ES Modules

ES Modules【ESM】是用于处理模块的ECMAScript标准。模块会将一些函数和变量放入一个模块作用域里，模块作用域使得模块中的不同函数能够共享这些变量。

目前，有ESM和CommonJS两种模块系统被广泛使用。Node.js使用的是CommonJS【CJS】规范，该规范存在一些对ESM的支持。

当一些东西对其它模块可用时，叫做“导出【export】”。当模块的导出存在时，其它模块可以显示地指定它们依赖于这个模块的某些变量、类或者函数。注意export导出的是变量，而export default导出的是值。

当使用模块来开发时，会建立一个模块依赖图，依赖来自于使用的import语句。需要提供一个文件来作为依赖图的入口，然后从入口开始，根据使用的import语句来找到其它所需要的代码。

软件工具

Babel

将ES6转为ES5的工具。

Webpack

Webpack是一个用于现代JavaScript应用程序的静态模块打包工具，当webpack处理应用程序时，会在内部从一个或多个入口点构建一个依赖图【dependency graph】，然后将项目中所需的每一个模块组合成一个或多个bundles，它们都是用于展示内容的静态资源。

Webpack可以完成前端工程化中很多的事情。

Rollup

Rollup是一款es module打包器，用于将散落的模块打包到一起。和Webpack相比，它没有强大的功能，只是一个小巧高效的打包工具。

Node.js

node.js是给予Chrome V8引擎的js运行环境。

可通过下载node.js安装包来安装node.js和npm。

npm

npm是node.js内置的一套包管理工具。

由于npm有些资源可能不能通过国内网络正常访问，会导致用npm安装依赖包时失败，所以还会用到npm的国内镜像cnpm。

npm install -g cnpm --registry=http://registry.npm.taobao.org

安装完成后就可以用cnpm代替npm来安装依赖包了。