还有就是要安装node.js环境，我有点疑惑，为什么要装它，js脚本不是在浏览器运行吗，以前我接触juery的时候，调试的时候是用Hbuilder的，边写边用浏览器同步看效果。

这里为什么还要安装node.js呢？

总结：

1、教程里的安装vue.js ，这个vue.js是一个脚本文件吗？安装到哪里呢？

2、为什么要安装node.js环境？

 

答：

1、安装是构建环境安装依赖，就是把vue.js从npm上下载到node_modules里，这就是安装的含义

2、不同开发模式，可以用html+js来开发，也可以用.vue文件+node.js环境来开发

3、你既可以用<script>引入vue，这样是一个最小化的引入。也可以使用vue全家桶，叫做vue-cli，这是一套官方出的工具，描述一下就是vue+一套构建工具。安装也是指这玩意，这玩意需要nodejs。全家通和你用Hbuilder以及“边写边用浏览器同步看效果”并不冲突。至于这玩意有啥用，这一套给你提供了vue开发中许多问题的标准解决方案，包括不仅限于，0成本让你用上最新的语法进行开发，解决前后端分离的许多问题，立刻开始单页面应用开发，提供一个vue项目的文件结构组织形式等等

 

     现代前端的发展已经超乎了所有人的想象，曾几何时我们还在手撸HTML,CSS,JS，然而时过境迁，那样的时代几乎已经一去不返了。

     jQuery在前端全面进入编译化的时代里渐渐受到了冷落。而vue，这样一个本该全面拥抱新时代的新生儿，却在骨子里保留着那一份传统，以悲壮而孤傲的态度向世人（主要是Angular和React）宣布：只有我，还坚持着引入JS文件方式支持传统开发模式。现在大部分前端开发vue，不，开发所有前端产品，不再是手撸HTML了，他们会先安装node.js，用npm，用webpack，用yarn，用各种cli。

      调试时也不再是用浏览器打开静态html调试了，直接yarn serve后在本地就会形成http://localhost:xxx的标准网站结构，而且页面内容热重载，任何代码改动，页面都会自动更新。数据交互时也不再需要与后端工程师面对面交流，也不再需要学习任何一种后端语言，或者模板语言（类似于freemarker这类的），直接就是API文档沟通彼此了。产品发布时，也不再是各种js,css,img文件夹了，而是对各种js、vue、ts源代码进行编译打包，最后形成了一个dist文件夹，里面拥有打包混淆好鬼都没法理解的最终文件，直接扔进nginx中就能跑。

   以上，是大多数情况。对于另一部分以传统后端工程师为主的前端需求者来说，是不是觉得好复杂，技术栈又要扩充插槽了，脑插显然不太够用。于是，VUE的作者 @尤雨溪 同志，发誓要将vue打造成永远像jQuery一样好用的传统js库，即使是即将迎来的vue3.0时代，也同样如此。于是我们还可以一边用着vue，一边愉快地手撸HTML，愉快地用<script src="">的方式引入vue。如果你能力不弱，完全可以用传统JS的方式，配合VUE构造出一个同样模块化的前端产品出来，甚至可以用它构造出SEO友好的、多页应用的、支持不同语言SSR（服务器端渲染）的前端产品。这么一来，node.js，webpack什么的，见鬼去吧。（注意，这里我的言下之意是：使用node.js、webpack之流很难构建出SEO友好的、多页应用的、支持不同语言SSR的前端产品，因此技术选型确实需要慎重考量。）当然，精力富裕的话，webpack开发模式也建议学一下的，可以打开一个新的世界。

讨论贴：https://bbs.csdn.net/topics/395965179

 

vue.js开发方式，用html+js和.vue文件+node.js环境开发的区别是什么？

 

作者：j小鑫
链接：https://www.zhihu.com/question/375249640/answer/1053111698
 

html+js的vue开发一般就是指每个页面创建夜歌vue实例，来管理该html页面的数据和时间绑定。

而.vue+node.js的话是利用基于webpack构建的vue脚手架vue-cli来开发vue的单页应用(spa)。

前者是没有脱离传统意义的原生html开发，就是有几个页面建几个html文件。

后者是利用内存将所有的dome元素存储在js变量中，需要的时候就拿出来渲染到页面上。根本来说是只有一个html文件的，但是使用的时候看上去是有多个页面的。这么做的优点是，所有的页面都放在内存中，只需要加载一次，调用的时候也特别高效。用户在做切换的时候非常的流畅，体验非常好。但是缺点就是，因为没有事先渲染dome元素，所以seo非常的差劲。

其实这种单一html文件的模式在html+js的开发方法里面也是可以做到的。但是这里复杂的组件定义和调用，还有各种不同的实例混淆策略，都要手写在一个html或者js文件中。这样的代码别说写了，给你一个现成的让你看你都害怕。（当然你可以说一个js文件存放一个vue实例的代码，但是当项目组件达到几十甚至上百个的时候，生命周期都会把你搞崩溃）。

所以这么说来的话，借助vue-cli来开发。你就可以将每个组件建一个.vue文件来管理，所有的混淆策略都已经帮你做好了。路由也可以用vue-router来控制开发，非常的方便。让你轻松的构建拥有上百个页面的大型前端项目！