可以不学nodejs直接学vue吗（js学到啥程度才可以学vue）

本文目录

• js学到啥程度才可以学vue
• 想做web前端的工作，应该先学什么
• 搭建vuejs安装环境之前是不是要先安装nodejs
• 新手入门如何学习vue
• nodejs一定要搭配vue吗
• vue为什么需要nodejs 的环境

js学到啥程度才可以学vue

js学到会写页面，写过jQuery，就可以转vue。

Vue的核心库只关注图层，响应式数据绑定和组件化开发是其两大特点。

响应式数据绑定指的是vue.js会自动对页面中的某些数据的变化做出响应.(v-model指令可以实现数据的双向绑定)。

组件化开发指的是vue.js通过组件,把一个单页应用中的各种模块拆分到一个个单独的组件(component)中,我们只要先在父级组件中写好各种组件标签,并且在组件标签中写好要传入组件的参数,然后在写好各种组件的实现,整个应用就可以完成了。

Vue 是一个采用 MVVM 架构,一套用于构建用户界面的渐进式框架。Vue 被设计为可以自底向上逐层应用。

"渐进式" 的意思就是从少到多, 从弱到强, Vue 框架并不强制开发者一下子就使用它的全部.

Vue 从设计角度来讲，可以分成上图的这几大部分，但是开发者并不需要把所有的东西都学会, 或者都用上. "声明式渲染" 和 "组件系统" 是 Vue 核心库所包含内容，而 "客户端路由"、"状态管理"、"构建工具" 都有其他各自专门的解决方案。

想做web前端的工作，应该先学什么

一个专业的前端开发工程师是必须掌握前端开发三大基本基石HTML、CSS，JavaScript。光会这些还不够，有了这些语言还需要各种工具的支撑，比较常见的有Dreamweaver，Sublime，HBuilder。还有FontelloFontello 、Secureheaders、Visual Studio CodeVisual Studio Code。

工具只能解决一些特定问题，要解决更加全面的问题就要接触到框架，三大基本框架有Angular、React、Vue，当然，以后还会接触到更多Bootstrap、 Fbootstrapp、BootMetro、Gumby、IVORY、Kube这样的框架。另外，一个优秀的前端开发工程师可能还要掌握SEO、DOM、BOM、Ajax等技能，甚至，网站性能优化和服务器端的相关基础知识也是需要了解的。

学会这些还不够，前端开发是一门发展的学科，不是学好了就可以停止学习，后面还会接触到更多新的内容。

由此可见，要想学好前端，绝对不简单，前端开发的广度和深度是其他行业所不能比拟的，你必须付出不懈的努力，才能收获这份果实。

搭建vuejs安装环境之前是不是要先安装nodejs

准确的说是使用vue-cli 搭建项目的时候需要nodejs。
你也可以用script标签引入vue.min.js这样的，没人拦你，在js里实例化vue，也行。
使用node有几件事，打包部署，解析vue单文件组件，解析每个vue模块，拼在一起，转码es6，less，等，启动测试服务器localhost8080, 帮你管理 vue-router，vue-resource这些插件，直接拿来用。
也就这些好处吧，这都是所谓前端工程化，是发展趋势，掌握这些东西也能提升你在职场的身价。

新手入门如何学习vue

这次给大家带来新手入门如何学习vue，新手入门学习vue的注意事项有哪些，下面就是实战案例，一起来看一下。
一、vue是什么
Vue 是一套用于构建用户界面的 渐进式框架 。
压缩后仅有17kb
二、vue环境搭建
你直接下载并用 《script》 标签引入， Vue 会被注册为一个全局变量。
但在用 Vue 构建大型应用时推荐使用 NPM 安装。
这里推荐一下是用淘宝的cnpm，非常的快
***隐藏网址***
# 全局安装 vue-cli
npm install --g vue-cli
# 创建一个基于 webpack 模板的新项目
vue init webpack my-project
# 安装依赖，走你
cd my-project
npm run dev三、第一个vue应用
《!DOCTYPE html》
《html》
《head lang="en"》
《meta charset="UTF-8"》
《title》《/title》
《/head》
《body》
《p id="app"》
《p》{{title}}《/p》
《button @click="say()"》单击事件《/button》《/br》
《p》今年{{age}}《/p》
《input v-model="age"》
《/p》
《/body》
《/html》
《script src="lib/vue.js"》《/script》
《script src="js/hello.js"》《/script》
var app = new Vue({ //通过构造函数Vue就可以创建一个Vue的根实例，并启动Vue应用
el: ’#app’, //指定页面上一个已经存在的DOM元素来挂载Vue实例
data: { //对象的数据
title: ’hello vue’, //通过插值语法{{}}绑定
age: 22 //通过v-model进行双向数据绑定
},
methods: { //对象的方法
say: function(){
console.log(this.title);
}
},
watch: { //监听数据的变化
’age’: function(newVal, oldVal){
console.log(newVal, oldVal);
}
}
});
四、Vue生命周期
每个Vue 实例创建时，都会经历一系列的初始化过程，同时也会调用相应的生命周期钩子，我们可以利用这些钩子，在合适的时机执行我们的业务逻辑。
大体上的生命周期就是：创建（created)---挂载(mounted)---销毁(destroy)
Vue 的生命周期钩子比较常用的有：
? created 实例创建完成后调用，此阶段完成了数据的观测等， 但尚未挂载， $el 还不可用。 需要初始化处理一些数据时会比较有用．
? mounted el 挂载到实例上后调用， 一般我们的第一个业务逻辑会在这里开始。
? beforeDestroy 实例销毁之前调用。 主要解绑一些使用addEventListener 监听的事件等。
var app =new Vue({
el: ’# app’,
data: {
a: 2
} ,
created: function () {
console.log(this.a); //2
},
mounted: function () {
console.log(this.el); //《p id =”app”》《/p》
}
});完整的一个生命周期图：

相信看了本文案例你已经掌握了方法，更多精彩请关注Gxl网其它相关文章！
推荐阅读：
Vue项目应该怎么分环境打包
webpack v4 从dev到prd的详细步奏

nodejs一定要搭配vue吗

不一定要装nodejs。使用Vue有两种方式：1、利用vue-cli搭建vue项目，此时需要用到nodejs；2、创建一个html文件，在该文档中使用script标签引入“vue.js”文件，这样就用不到node，也就不需要安装。

vue为什么需要nodejs 的环境

一、JavaScript

传统的JavaScript是运行在浏览器上的，因为浏览器的内核分为两个部分

二、什么是Node.js

Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境，运行在服务端的JavaScript。Node.js 使用了一个事件驱动、非阻塞式 I/O 的模型，使其轻量又高效。

综上所述，vue.js 是通过 webpack来打包，而webpack 又基于 npm, npm需要nodejs环境。这就是为什么vue.js 还需要安装nodejs环境。

将目标dist文件夹拷贝到一台未安装nodejs的 nginx服务器上，访问页面可以正常响应逻辑。这时跟nodejs没有任何关系，服务器又不是nodejs在担当，而是nginx。如果你用nodejs来部署服务器，则需要在目标机上安装nodejs.

简单的说：你既可以开发nodejs的服务程序，亦可以用基于nodejs的npm && webpack来打包 目标前端页面。vue.js 使用webpack来打包，故而需要nodejs环境。

参考文章