vue全家桶都包括有什么?

全家桶,顾名思义,对于开发一个完整的中大型单页面应用项目所必须的所必须的插件和框架。

vue全家桶都包括有什么?

Vue有著名的全家桶系列,包含了

1,调试插件:可以选择 Chrome 插件 vue Devtool(需要下载工具包)。

打开控制台选择 vue 面板。也可以选择 Vuex 选项。vuex(http://vuex.vuejs.org),

2,构建工具vue-cli脚手架

vue-cli也叫脚手架,官方定义为Vue.js 开发的标准工具!相比scirpt标签引入,脚手架具有如下特点:

1)、功能丰富

对 Babel、TypeScript、ESLint、PostCSS、PWA、单元测试和 End-to-end 测试提供开箱即用的支持。

2)、易于扩展

它的插件系统可以让社区根据常见需求构建和共享可复用的解决方案。

3)、无需 Eject

Vue CLI 完全是可配置的,无需 eject。这样你的项目就可以长期保持更新了。

4)、CLI 之上的图形化界面

通过配套的图形化界面创建、开发和管理你的项目。

5)、即刻创建原型

用单个 Vue 文件即刻实践新的灵感。

6)、面向未来

为现代浏览器轻松产出原生的 ES2015 代码,或将你的 Vue 组件构建为原生的 Web Components 组件。

3,vuex (状态管理)

Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。Vuex 也集成到 Vue 的官方调试工具 devtools extension,提供了诸如零配置的 time-travel 调试、状态快照导入导出等高级调试功能。

什么情况下我应该使用 Vuex?

Vuex 可以帮助我们管理共享状态,并附带了更多的概念和框架。这需要对短期和长期效益进行权衡。

如果您不打算开发大型单页应用,使用 Vuex 可能是繁琐冗余的。确实是如此——如果您的应用够简单,您最好不要使用 Vuex。一个简单的 store 模式就足够您所需了。但是,如果您需要构建一个中大型单页应用,您很可能会考虑如何更好地在组件外部管理状态,Vuex 将会成为自然而然的选择。

安装方法

npm install vuex --save

4,vue-router(http://router.vuejs.org),

Vue Router 是 Vue.js 官方的路由管理器。它和 Vue.js 的核心深度集成,让构建单页面应用变得易如反掌。包含的功能有:

1)嵌套的路由/视图表

2)模块化的、基于组件的路由配置

3)路由参数、查询、通配符

4)基于 Vue.js 过渡系统的视图过渡效果

5)细粒度的导航控制

6)带有自动激活的 CSS class 的链接

7)HTML5 历史模式或 hash 模式,在 IE9 中自动降级

8)自定义的滚动条行为

5,vue-resource(https://github.com/pagekit/vue-resource)

6,sass样式,http://sass.bootcss.com/

7,axios是一个http请求包,vue官网推荐使用axios进行http调用。

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

特性

1)从浏览器中创建 XMLHttpRequests

2)从 node.js 创建 http 请求

3)支持 Promise API

4)拦截请求和响应

5)转换请求数据和响应数据

6)取消请求

7)自动转换 JSON 数据

8)客户端支持防御 XSRF

8,ui组件(如iview、vant、elementUI等等):

  • iview 一套基于 Vue的高质量UI 组件库(分为小程序和pc端等不同版本);

  • vant 轻量、可靠的移动端 Vue 组件库,是有赞开源的一套基于 Vue 2.0 的 Mobile 组件库,旨在更快、更简单地开发基于 Vue 的美观易用的移动站点。

  • Ant Design Vue 是 Ant Design 的 Vue 实现,开发和服务于企业级后台产品。

  • elementUI 是基于 Vue 2.0 桌面端中后台组件库。

就是一个完整的vue项目的核心构成。

概括起来主要就是:

  1. 项目构建工具vue-cli、

  2. 路由vue-router、

  3. 状态管理vuex、

  4. http请求工具axios。

Vue两大核心思想:组件化和数据驱动。

  • 组件化:把整体拆分为各个可以复用的个体,

  • 数据驱动:通过数据变化直接影响bom展示,避免dom操作。

更多web前端知识,请查阅 HTML中文网 !!

以上就是vue全家桶都包括有什么?的详细内容,更多请关注web前端其它相关文章!

赞(0) 打赏
未经允许不得转载:web前端首页 » Vue.js 答疑

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

前端开发相关广告投放 更专业 更精准

联系我们

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏