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. Android spinner 样式及其使用详解

    设计与开发首页 > 应用专题 > 移动开发 > 正文> Android spinner 样式及其使用详解 相关文章: Android 开源项目应用程序与框架推荐 Android ...

  2. PHP-Windows下搭建PHP-MSF环境【原创】

    环境: Windows7 64位 php-7.0.19 php-swoole-1.9.15 php-yac-2.0.2 php-redis-3.1.2 php-mongodb-1.2.10 遇坑: C ...

  3. 致Play Framework开发者们的一封信

    2012/04/06  导读:3月中旬,Play Framework 2.0 正式版发布了.2.0 版本的主要新特性:内置对 Java 和 Scala 的支持.完全异步编程模型.侧重于类型安全.强大的 ...

  4. linux中DHCP服务配置文件/etc/dhcpd.conf详细说明

    DHCP服务的配置 dhcpd.conf 是DHCP服务的配置文件,DHCP服务所有参数都是通过修改dhcpd.conf 文件来实现,安装后dhcpd.conf 是没有做任何配置的,将/usr/sha ...

  5. 解决IE弹框提示“是否停止运行此脚本”问题

    有少数情况因为js处理内容较多,系统计算标红和刷新页面较慢,IE可能会弹框提示“是否停止运行此脚本”,若想要继续,点击“否”即可.并同时按照下面的设置更改一下注册表,即可解决弹框问题. http:// ...

  6. JavaScript插件：快速选择日期----jedate日历插件

    jedate是一款轻量级JS库,可快速选择日期 http://www.sucaijiayuan.com/Js/DateTime/1371.html 使用方法: 下载jedate , 解压后不要改变文件 ...

  7. Rplidar学习（二）—— SDK库文件学习

    SDK头文件介绍 1.头文件简介: rplidar.h //一般情况下开发的项目中仅需要引入该头文件即可使用 RPLIDAR SDK 的所有功能. rplidar_driver.h //定义了 SDK ...

  8. SpringBoot配置属性之NOSQL

    SpringBoot配置属性系列 SpringBoot配置属性之MVC SpringBoot配置属性之Server SpringBoot配置属性之DataSource SpringBoot配置属性之N ...

  9. 创建在“system.net/defaultProxy”配置节中指定的Web代理时出错解决办法。

    出现这种问题会有很多原因,大致解决方法 方法1:在CMD下输入netsh winsock reset命令 简单来说netsh winsock reset命令含义是重置 Winsock 目录.如果一台机 ...

  10. 高效的MySQL分页——利用子查询分页

    ——先抄回来~~~ 首先看一下分页的基本原理: mysql> explain SELECT * FROM message ORDER BY id DESC LIMIT 10000, 20G*** ...