使用VUE搭建H5项目

最近开发一个h5项目，项目使用的vue2.0+vant

创新互联建站专业为企业提供湘乡网站建设、湘乡做网站、湘乡网站设计、湘乡网站制作等企业网站建设、网页设计与制作、湘乡企业网站模板建站服务，十载湘乡做网站经验，不只是建网站，更提供有价值的思路和整体网络服务。

主要有以下几步

1、使用vue-cli创建项目

2、引入vue-router

3、引入vuex及vuex-persistedstate

4、引入vantui

5、引入sass

6、引入flexible

7、引入postcss-pxtorem

8、引入axios

9、配置开发生产测试环境参数

10、引入其他相关库，例如moment、lodash等

为什么感觉学了vue之后编程能力下降了？

这几天我也是因为一个项目而被迫使用vue，坦白的说vue和传统的网站开发思路不同，导致爱的人爱死，老程序员烦死的现状。

主要区别：

1传统方式：我们做一个网站，首先创建几个文件夹(css、js等等)，页面需要用的资源文件，都放到各自的文件夹里。然后创建若干个HTML网页，一个个链接把这些若干网页串起来就OK，网页里需要有什么事件或效果，要么用原生js要么用jqurey，去操作某个dom，实现页面变化。

调试的时候也很简单，如果静态网页，浏览器就可以直接运行调试。asp、jsp、php、.net等动态网站，简单配置一下iis或Tomcat，也就能直接调试。

2vue(这里用vue脚手架来举例)：

vue和传统最大的区别就是，vue只有一个html页面(也就是入口页面，你也可以理解成主页面)，除了主页面之外，其他的页面都是html片段，以.vue为后缀的片段文件存在，用户访问网站的时候，第一次加载完整主页面，后面的点击其实就是变化html片段而已。(和老程序员理解的局部刷新有点像)

所以vue特别适合制作手机端项目，因为它只需要根据用户的点击，加载所需的片段而已。由于不用一页一页请求新网页，所以这种机制会让手机项目运行非常丝滑顺畅。

但优点也是它的缺点，vue项目的特性决定它不适合做网站，稍微有点seo知识的人都明白，这种机制做的网站，机器人是爬不到任何内容的。

vue的部署也是让我很诟病的，部署它需要折腾一大堆事儿。首先需要安装nodejs，你可以暂时把它理解成和iis Tomcat类似的网站发布容器。因为只有在nodejs下才能调试vue脚手架项目。

nodejs装完，然后在cmd命令行下，通过npm命令安装一大堆各种库插件。

这一堆事儿折腾完，你就可以通过一个命令创建一个vue脚手架，然后开始你的项目开发之旅。

很多老程序员被“vue脚手架”这个词搞得云里雾里，简单的说：上面折腾一大堆，就是为了最后敲一个命令，让系统帮你在指定位置创建一组文件夹，然后vue能用上的各种js(百十多个吧)组件都放在这各个文件里，供你开发时候调用。

对比你之前的操作，相当于：你建好文件夹，在js文件夹里放好jqurey，和你常用的js。

所以这套步骤，开始让我很不习惯，可能很多老程序员也不习惯。会让你有种“为了做个小项目，先要部署一套大工厂的感觉”。

很多老程序员其实都是做小项目出身的草根，什么百万千万的迸发、什么团队协作、前后端分离等话题，不是这类程序员关心的。他们往往即是美工也是程序员，即是前端也是后端。几乎都是以快速交付项目为第一初衷，不想为了个环境来回折腾。所以一时间适应不了vue开发模式。

另外如果你的项目，定制化程度较高。我个人还是建议采用独立html的传统方式开发。

如果是移动端开发，vue的确是最佳选择。顺便提一下，vue和小程序几乎是一摸一样的套路，会一个两个就都会了。

我也是花了2天时间，从排斥到接受的。目前用着还不错。

使用框架并不会让你的技术变菜，相反，框架能够让你更加方便、快速的实现某些功能。

框架的出现，使开发变得更加简单，设想，如果vue没有nodejs的支持，你还会去使用吗？各种依赖，各种配置，统统需要你自己手工构建，你会把大量的时间花费在无用的地方，而忽略了你所需要实现的也许需求。

如果你感觉使用各类框架导致你的能力降低了。那只能说你自己的能力还有待提高。

提升你的技术不一定要会很多编程语言，需要去了解思想。那么在使用vue的时候，有没有思考过，vue为什么要这样设计，这样设计有什么优势，如果是我，我会怎么设计。

如果你专注于前端开发，那你可以尝试自己去实现一个vue，当做你的技术提升。

反问提问者一个问题，你在使用jquery后，有没有感觉你的技术下降了？

个人的一些观点，欢迎讨论！

我就是写框架造轮子的，框架的出现的确会让程序员能力减弱，变成框架操作员，例如spring java的出现，使得后台开发人员不需要知道epoll tcp底层原理，不需要知道条件变量 信号量 共享内存怎么实现进程间通信。但是框架是我们开发效率更好，题主可以反向思考java c的出现降低了我们对计算机底层指令的理解，我们为何不用汇编编程？不要太在意技术本省能达到目的就是好技术。

大家要记住:互联网和建筑一样，程序员和水泥工都只是这个行业的底层人员。我们在追求技术的时候想想水泥工在外人面前比砌砖技术的场景，就不会死揪不放了。

vue是前端三大框架之一。在日常的开发工作中，能便于我们快速搭建前端框架，快速的启动项目进入细节开发。当用的时间长了以后，你会更加的依赖框架。

我们都知道人生的境界有三层:第一层看山是山，看水是水;第二层看山不是山，看水不是水;第三层，看山还是山，看水还是水。跟着人生的境界一样，其实你已经达到了第二层境界。

开发能力也主要分为三层境界。

一，从零开始，徒手开发。

这个境界都是新手。这时候可能你只知道HTML ,CSS和js。根本都不知道后面的框架，所以这个时候需要自己徒手搭建框架，徒手写页面路由，手动完成页面自适应等。这时候恐怕页面的一个轮播图，都够自己费脑子的，得花上一天或者更多的时间写好这个轮播图。

这个阶段就相当于你小时候学走路的阶段，只有当你学会这个走路，才会后有后面的奔跑跳跃的动作。记得当时我学习前端的时候，在这个第一个阶段，很是苦恼，为什么我一个简单的页面，要花费很长的时间去写，花费很长的时间去写一个组件，一个下拉框，一个三级菜单栏。等我过了这个阶段就豁然开朗了。

二，应用框架，插件，快速开发。

走过了第一个阶段，渐渐的接触到了应用框架，和一些组件。就拿这个vue来说，可能轻轻松松十几分钟就能启动一个项目，当初在第一个阶段来说，可能花两三天去搭建项目。

然后很多组件也不需要自己写了，有丰富的前端UI组件，什么轮播图，页面自适应布局，各种各样的按钮，生拖硬拽就行了，分分钟搞定。

这个时候的工作就进入了一个舒适区，也达到了一个自我满足的状态，殊不知在这个境界里，稍有不慎，你可能就废在这里了。还有第三重境界在等着你。

三，从零开始，徒手造轮子。

到了这里，可能有人会问，这里也是从能开始，为什么和第一重境界不一样？

那确实是不一样，过了第二重境界，为什么要回到从零开始呢？这里不是一种倒退，而是一种进步。在第二个阶段，你的生拉硬拽。你会发现已经不能满足你的开发工作了。因为在这里的很多开发都是被局限在这些框架里了，如果你想创造不一样的样式，就需要你从零开始徒手造轮子。

你需要用原生的底层的东西，去造属于你自己的东西，去写一套你自己的框架，自己的组件。你所写的这些东西都属于你自己独有的，不再和别人一样都是千篇一律的东西。

当然，这第三层境界也并不是那么容易达到的，有的人需要花费三五年，有的人则需要花费数十年。

所以说当你熟练运用这些框架以后，你发现自己的编程能力变弱了，这正是在告诉你，需要学习更多的东西，以便于你能够顺利的达到开发的第三种境界。

Vue 就是一个把问题搞复杂的东西 让你忘记你出发的目的是什么。面试的时候，我遇到精通vue 直接pass ，这种人毫无用处

vue世界都是组件，现在编程，闭门造车时代已经过去了，我们就是更方便实现功能就好了。类比于制造业，不能说我要做 汽车 ，还要先去挖矿炼铁和种植橡胶，下降的是不需要的能力，例如挖矿能力和耕地能力。什么框架能提高我们效率就死好框架。

坚守JSP + H5

你怎么就是意识不到呢？让你能力下降的是你的懒惰和缺乏学习欲望还没有深究的习惯，而不是一个优秀的框架，框架制造出来的初衷是为了提高生产效率，降低开发人员的压力，提高开发人员的幸福感，唯独跟帮你提高自己的编程水平没有任何直接联系。对于已经水平够好的人，他有资格让自己的工作变得开心一些，甚至他们通过自己开发很多优秀的工具框架来实现这个目标，但是水平还比较菜的人没有这个资格，除非他们不想进步。因此，你这个问题非常缺乏逻辑，如果拥有了一把枪让你的搏击能力下降，那是你的问题，不是枪的问题；如果拥有了 汽车 让你的运动能力下降，那也是你的问题，不是车的问题。你可以坦然接受这种下降并且不认为这是什么坏事情，但请不要让一个工具替你背锅！

不是vue让你能力下降，是你本来就能力弱。很多人学vue都是一知半解，做个简单的增删改查就觉得自己精通了，连html，css，js基础都是速成的，没掌握好，就捡起vue这样的框架了，没有现成的组件库，啥也不会写。vue不是要代替这些基础技能，是为了给有能力的人提供更方便的工具。还有人喷jquery过时了，怕是他们连vue和jquery的本质区别都搞不清楚，适合的场景也不知道。不是vue让人能力下降了，是你根本就没有接触到复杂需求，或者说因为你能力弱，所以根本就不会给你接触复杂需求的机会

这个问题就好比用了jquery感觉对原生js的理解越来越浅，框架和库都是为了帮助我们提高开发效率的，往往会让我们忽略本质的技术 这才是问题所在，所以用的时间长了 当你丢下库和框架的时候你会发现都不会写代码了

哪些网站使用了vue？

国内的如下网站用了vue框架：bilibili 掘金B站，简书，微信的开发文档网站。

Vue.js（读音 /vjuː/, 类似于 view） 是一套构建用户界面的渐进式框架。

Vue 只关注视图层， 采用自底向上增量开发的设计。

Vue 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。

Vue.js可以作为一个js库来使用，也可以用它全套的工具来构建系统界面，这些可以根据项目的需要灵活选择，所以说，Vue.js是一套构建用户界面的渐进式框架。

Vue的核心库只关注视图层，Vue的目标是通过尽可能简单的 API 实现响应的数据绑定，在这一点上Vue.js类似于后台的模板语言。

Vue也可以将界面拆分成一个个的组件，通过组件来构建界面，然后用自动化工具来生成单页面(SPA - single page application)系统。

在本系列文章中，我们介绍了JavaScript棱镜中不同概念，算法和数据结构的基础。 长期以来，计算机科学一直是JS开发人员忽略的主题，因为它在现代开发中不适用。

我们已经为我们解决了一些基本问题，而且我们将永远不必实现自己的基本算法。 但是，对这些概念的正确理解确实可以改善我们。 不是我们JavaScript知识，而是我们对软件开发的一般理解。

在本文中，我们将研究链接列表-它们的作用以及如何实现它们。.

简单点来说你可以理解vue基于js是一个js库，但是Vue的核心库只关注视图层，Vue的目标是通过尽可能简单的 API 实现响应的数据绑定，在这一点上Vue.js类似于后台的模板语言。