Vuejs开发环境搭建及热更新【推荐】


Posted in Javascript onSeptember 07, 2018

 Vue.js

Vue.js是目前很火的一个前端框架,采用MVVM模式设计,它是以数据驱动和组件化的思想构建的。相比于Angular.js,Vue.js提供了更加简洁、更易于理解的API,使得我们能够快速地上手并使用,特别适合单页应用的开发。

Vue.js是数据驱动的,它通过一些特殊的语法,将DOM和数据绑定起来,无需手动操作DOM。一旦创建了绑定,DOM将和数据保持同步,每当变更了数据,DOM也会相应地更新。

一、安装NPM

1.1最新稳定版本:

npm install vue

二、命令行工具安装

国内速度慢,使用淘宝镜像:

npm install -g cnpm --registry=https://registry.npm.taobao.org

注意:以后使用npm的地方就替换成cnpm

1、全局安装vue-vli

​    cnpm install -g vue-cli

2、创建一个基于webpack模板的新项目

vue init webpack my-project

输入安装命令后,稍等一会提示输入:

2.1项目项目名称:

2.2项目描述:

2.3作者:

2.4是否使用ESlint:(可以选择不需要,ESlint是一套语法检查工具)

2.5是否需要单元测试:(可以选择不需要)

说明:

       webpack:项目类型,用webpack这套模板进行压缩和打包。

       my-project:项目名称。

3、安装依赖

3.1进入项目:

cd my-project

3.2安装依赖:

cnpm install

说明:

3.2.1会将依赖安装到项目node_modules文件夹中。

3.2.2可以使用cnpm命令,是因为webpack安装好了相应依赖。

3.2.3 Package.json文件说明:

             主要包含:项目描述、相关依赖。

3.3运行项目:

cnpm run dev 

通过访问http://127.0.0.1:8080访问运行起来的项目。

三、参考链接

Vuejs官网:https://cn.vuejs.org/v2/guide/installation.html

Taobao镜像:http://npm.taobao.org/

总结

以上所述是小编给大家介绍的Vuejs开发环境搭建及热更新,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
强制设为首页代码
Jun 19 Javascript
Javascript 读书笔记索引贴
Jan 11 Javascript
javascript跑马灯悬停放大效果实现代码
Dec 12 Javascript
原始的js代码和jquery对比体会
Sep 10 Javascript
JavaScript实现twitter puddles算法实例
Dec 06 Javascript
javascript下拉框选项单击事件的例子分享
Mar 04 Javascript
JavaScript函数参数使用带参数名的方式赋值传入的方法
Mar 19 Javascript
Jquery easyui 实现动态树
Nov 17 Javascript
jQuery基于ajax方式实现用户名存在性检查功能示例
Feb 10 Javascript
JavaScript仿微信(电话)联系人列表滑动字母索引实例讲解(推荐)
Aug 16 Javascript
vue+element-ui实现表格编辑的三种实现方式
Oct 31 Javascript
微信小程序实现滚动加载更多的代码
Dec 06 Javascript
小程序点赞收藏功能的实现代码示例
Sep 07 #Javascript
前端防止用户重复提交js实现代码示例
Sep 07 #Javascript
vue实现打印功能的两种方法
Sep 07 #Javascript
使用Angular-CLI构建NPM包的方法
Sep 07 #Javascript
详解如何构建一个Angular6的第三方npm包
Sep 07 #Javascript
vue2.0 可折叠列表 v-for循环展示的实例
Sep 07 #Javascript
Js中使用正则表达式验证输入是否有特殊字符
Sep 07 #Javascript
You might like
php入门学习知识点八 PHP中for循环基本应用之九九乘法口绝表
2011/07/14 PHP
Joomla语言翻译类Jtext用法分析
2016/05/05 PHP
PHP PDOStatement::getColumnMeta讲解
2019/02/01 PHP
xmlHTTP实例
2006/10/24 Javascript
js Array对象的扩展函数代码
2013/04/24 Javascript
jquery 文本上下无缝滚动,鼠标放上去就停止 小例子
2013/06/05 Javascript
js动态修改input输入框的type属性(实现方法解析)
2013/11/13 Javascript
javascript模拟php函数in_array
2015/04/27 Javascript
jQuery对checkbox 复选框的全选全不选反选的操作
2016/08/09 Javascript
JS简单测试循环运行时间的方法
2016/09/04 Javascript
seajs学习教程之基础篇
2016/10/20 Javascript
AngularJs 禁止模板缓存的方法
2017/11/28 Javascript
解决Js先触发失去焦点事件再执行点击事件的问题
2018/08/30 Javascript
浅谈Vue.js 中的 v-on 事件指令的使用
2018/11/25 Javascript
基于vue的验证码组件的示例代码
2019/01/22 Javascript
JavaScript 作用域scope简单汇总
2019/10/23 Javascript
在Vue项目中,防止页面被缩放和放大示例
2019/10/28 Javascript
js 对象使用的小技巧实例分析
2019/11/08 Javascript
JS数组push、unshift、pop、shift方法的实现与使用方法示例
2020/04/29 Javascript
原生js+canvas实现贪吃蛇效果
2020/08/02 Javascript
Vue ​v-model相关知识总结
2021/01/28 Vue.js
Python中如何获取类属性的列表
2016/12/26 Python
Python语言描述机器学习之Logistic回归算法
2017/12/21 Python
Python用for循环实现九九乘法表
2018/05/31 Python
详解python路径拼接os.path.join()函数的用法
2019/10/09 Python
Python如何存储数据到json文件
2020/03/09 Python
python 递归调用返回None的问题及解决方法
2020/03/16 Python
Python实现文件压缩和解压的示例代码
2020/08/12 Python
HTML5实现桌面通知 提示功能
2017/10/11 HTML / CSS
canvas 绘图时位置偏离的问题解决
2020/09/16 HTML / CSS
Marmot土拨鼠官网:美国专业户外运动品牌
2018/01/11 全球购物
GAZMAN官网:澳大利亚领先的男装品牌
2019/12/19 全球购物
高三自我鉴定怎么写
2013/10/19 职场文书
考博自荐信
2013/10/25 职场文书
机关单位动员会主持词
2014/03/20 职场文书
《每逢佳节倍思亲》教后反思
2014/04/19 职场文书