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 相关文章推荐
window.open被浏览器拦截后的自定义提示效果代码
Nov 19 Javascript
JS保留两位小数,多位小数的示例代码
Jan 07 Javascript
用js的document.write输出的广告无阻塞加载的方法
Jun 05 Javascript
js实现完全自定义可带多级目录的网页鼠标右键菜单方法
Feb 28 Javascript
深入理解JavaScript系列(48):对象创建模式(下篇)
Mar 04 Javascript
jQuery实现给input绑定回车事件的方法
Feb 09 Javascript
JS+html5制作简单音乐播放器
Sep 13 Javascript
利用nginx + node在阿里云部署https的步骤详解
Dec 19 Javascript
JavaScript this在函数中的指向及实例详解
Oct 14 Javascript
微信小程序上传图片并等比列压缩到指定大小的实例代码
Oct 24 Javascript
JavaScript 替换所有匹配内容及正则替换方法
Feb 12 Javascript
JavaScript中条件语句的优化技巧总结
Dec 04 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循环获取GET和POST值的代码
2008/04/09 PHP
解析如何屏蔽php中的phpinfo()函数
2013/06/06 PHP
php+ajax实现仿百度查询下拉内容功能示例
2017/10/20 PHP
laravel框架中视图的基本使用方法分析
2019/11/23 PHP
javascript之更有效率的字符串替换
2008/08/02 Javascript
基于jQuery的淡入淡出可自动切换的幻灯插件
2010/08/24 Javascript
js获取元素到文档区域document的(横向、纵向)坐标的两种方法
2013/05/17 Javascript
使表格的标题列可左右拉伸jquery插件封装
2014/11/24 Javascript
jQuery获取标签文本内容和html内容的方法
2015/03/27 Javascript
jQuery实现仿微软首页感应鼠标变化滑动窗口效果
2015/10/08 Javascript
javascript制作照片墙及制作过程中出现的问题
2016/04/04 Javascript
jQuery.form插件的使用及跨域异步上传文件
2016/04/27 Javascript
Bootstrap整体框架之CSS12栅格系统
2016/12/15 Javascript
JS实现的样式切换功能tableCSS实例
2016/12/30 Javascript
jQuery实现链接的title快速出现的方法
2017/02/20 Javascript
JavaScript实现父子dom同时绑定两个点击事件,一个用捕获,一个用冒泡时执行顺序的方法
2017/03/30 Javascript
基于 Vue.js 2.0 酷炫自适应背景视频登录页面实现方式
2018/01/17 Javascript
Javascript实现简易天数计算器
2020/05/18 Javascript
用Python输出一个杨辉三角的例子
2014/06/13 Python
Python基于pygame实现图片代替鼠标移动效果
2015/11/11 Python
Python实现包含min函数的栈
2016/04/29 Python
Python+Selenium自动化实现分页(pagination)处理
2017/03/31 Python
python将文本分每两行一组并保存到文件
2018/03/19 Python
Python中super函数用法实例分析
2019/03/18 Python
Python中使用logging和traceback模块记录日志和跟踪异常
2019/04/09 Python
python使用原始套接字发送二层包(链路层帧)的方法
2019/07/22 Python
解决Keras中Embedding层masking与Concatenate层不可调和的问题
2020/06/18 Python
python redis存入字典序列化存储教程
2020/07/16 Python
html5触摸事件判断滑动方向的实现
2018/06/05 HTML / CSS
Maje德国官网:法国女性成衣品牌
2017/02/10 全球购物
网络安全类面试题
2015/08/01 面试题
软件项目实施计划书
2014/05/02 职场文书
汽车检测与维修专业求职信
2014/07/04 职场文书
公司委托书怎么写
2014/08/02 职场文书
焦裕禄精神心得体会
2014/09/02 职场文书
运动会200米广播稿
2015/08/19 职场文书