1、node环境

详细见我之前的文章，node的安装

2、git环境

git bash命令窗，支持bash命令，cmd不支持bash命令

3、cnpm安装

cnpm是针对国内使用npm网络慢的而使用的

在cmd中输入：

npm install -g cnpm --registry=https://registry.npm.taobao.org
如果node的版本比较低，会执行不成功。需要升级node的版本，直接下载最新的node覆盖安装

4、下载vue.min.js和vue-resource.min.js

这是使用cnpm的方式

打开git bash，输入：cnpm install vue

　　　　　　　输入：cnpm install vue-resource

将下载到的vue.min.js和vue-resource.min.js放到项目中

5、截图说明

将title的值在data中绑定为hello vue，然后执行cartView方法，将title值修改为Vue hello

6、index.html

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport"

          content="width=device-width, user-scalable=no, initial-scale=1.0">

    <title>Title</title>

</head>

<body>

<div id="app">

<h2>{{title}}</h2>

</div>

<script src="js/lib/vue.min.js"></script>

<script src="js/lib/vue-resource.min.js"></script>

<script src="js/cart.js"></script>

</body>

</html>

7、cart.js

/**

 * Created by kk on 2017/4/16.

 */

var vm =new Vue({

    el:"#app",

    data:{

        title:"hello vue"

    },

    filters:{

    },

    mounted:function () {

        //类似于jquery中的ready方法

        this.cartView();

    },

    methods:{

        cartView:function () {

    this.title="Vue hello"

}

    }

});

非nodejs方式的vue.js的使用的更多相关文章

  1. 组件切换方式（Vue.js）

    这里,我用一个注册登录两组件的切换实例来演示: 切换方式一 <!DOCTYPE html> <html lang="zh-CN"> <head> ...

  2. vue.js插入dom节点的方式

    html代码: <div id="app"></div> js代码: var MyComponent = Vue.extend({ template: '& ...

  3. vue.js环境安装

    1.到官网(http://nodejs.cn/download/)下载Node.JS运行环境并安装(由于现在的Node中自带npm包管理器,所以就不需要额外下载npm了) 2.如果是新手,那么建议以引 ...

  4. Vue.js+vue-element搭建属于自己的后台管理模板：什么是Vue.js?（一）

    Vue.js+vue-element搭建属于自己的后台管理模板:Vue.js是什么?(一) 前言 本教程主要讲解关于前端Vue.js框架相关技术知识,通过学习一步一步学会搭建属于自己的后台管理模板,并 ...

  5. Vue.js入门指南（一）

      前  言 JRedu 之前用过一段时间的AnglarJS 1.X,在低版本的AngularJS中,脏值检查在变量增多的情况下会影响程序的响应速度.后期的2.X和更高版本在脏值检查等问题上做了优化, ...

  6. .Net Core+Vue.js+ElementUI 实现前后端分离

    .Net Core+Vue.js+ElementUI 实现前后端分离 Tags: Vue 架构 前端采用:Vue.js.Element-UI.axios 后端采用:.Net Core Mvc 本项目是 ...

  7. Vue.js高效前端开发 • 【初识Vue.js】

    全部章节 >>>> 文章目录 一.Vue概述 1.Web前端框架介绍 2.MVC和MVVM 3.Vue介绍 4.安装Vue 二.Vue使用 1.第一个Vue应用 2.Vue的双 ...

  8. 基于 Vue.js 之 iView UI 框架非工程化实践记要

    像我们平日里做惯了 Java 或者 .NET 这种后端程序员,对于前端的认识还常常停留在 jQuery 时代,包括其插件在需要时就引用一下,不需要就删除.故观念使然,尽管 Nuget 和 Maven ...

  9. 【Vue课堂】Vue.js 父子组件之间通信的十种方式

    这篇文章介绍了Vue.js 父子组件之间通信的十种方式,不管是初学者还是已经在用 Vue 的开发者都会有所收获.无可否认,现在无论大厂还是小厂都已经用上了 Vue.js 框架,简单易上手不说,教程详尽 ...

随机推荐

  1. windows上的Qt 5的依赖部署打包

    通常我们编译Qt程序的时候最终会生成exe或dll,这些可执行文件都会有Qt模块的依赖,如果项目一旦庞大,就不是很好看出缺了什么模块,导致安装包安装到其他绿色干净的windows机器上会提示缺少XXX ...

  2. poj 2059 单调栈

    题意:求柱状图中最大矩形面积. 单调栈:顾名思义就是栈内元素单调递增的栈. 每次插入数据来维护这个栈,假设当前须要插入的数据小于栈顶的元素,那就一直弹出栈顶的元素.直到满足当前须要插入的元素大于栈顶元 ...

  3. Struts1与Struts2的那些事

    一.概述 Struts1以ActionServlet作为核心控制器,由ActionServlet负责拦截用户的全部请求.Struts1框架有3个重要组成部分:Action.ActionForm和Act ...

  4. 删除现有的Recipient再重新添加选中的Contacts

    @Override protected void onActivityResult(int requestCode, int resultCode, Intent data) {     super. ...

  5. 十问Android NFC手机上的卡模拟（转）

    1,  问:能否在AndroidNFC手机上实现卡模拟? 答:在技术上可行,但是,对一般开发人员来讲,目前看来仅仅是技术上可行:( 2,  问:具体如何实现呢? 答:有两种方式:一种是基于硬件的,被称 ...

  6. Easyui + asp.net MVC 系列教程 第09-17 节 完成登录 高清录制

    前面八节 在这里 Easyui + asp.net mvc + sqlite 开发教程(录屏)适合入门 在接下来的 几节里面 我们完成登录功能 打开页面 首先进入登录页面 只有登录成功了 才能进入管理 ...

  7. Kubernetes 选择 IPVS

    什么是 IPVS ? IPVS (IP Virtual Server)是在 Netfilter 上层构建的,并作为 Linux 内核的一部分,实现传输层负载均衡. IPVS 集成在 LVS(Linux ...

  8. hihocoder 1638：多级并查集

    题目链接 并查集可以用于聚类. import java.io.FileInputStream; import java.io.FileNotFoundException; import java.ut ...

  9. 第一次使用Mac

    Mac禁用掉默认输入法 搜狗输入法已经包含中文.英文输入法了,其余输入法可以删除掉.按ctrol键的时候本来应该是搜狗输入法中英文切换,结果却是搜狗输入法和ABC输入法之间互相切换. 打开键盘偏好设置 ...

  10. libevent终于编译通过了

    在网上找了个例子,其实libevent本身带了很多测试用例,不过这是第一次编译成功,尼玛 各种高性能IO库都是在linux下的,win32果断被bs了,还好有libevent对win32支持的比较好. ...