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 相关文章推荐
中文字符串截取的js函数代码
Apr 17 Javascript
将字符串中由空格隔开的每个单词首字母大写
Apr 06 Javascript
jQuery select表单提交省市区城市三级联动核心代码
Jun 09 Javascript
JS上传图片前实现图片预览效果的方法
Mar 02 Javascript
js获取及修改网页背景色和字体色的方法
Dec 29 Javascript
javascript 面向对象function详解及实例代码
Feb 28 Javascript
canvas+gif.js打造自己的数字雨头像的示例代码
Oct 26 Javascript
js canvas实现二维码和图片合成的海报
Nov 19 Javascript
自定义Vue中的v-module双向绑定的实现
Apr 17 Javascript
vue+swiper实现左右滑动的测试题功能
Oct 30 Javascript
js删除对象中的某一个字段的方法实现
Jan 11 Javascript
vue-cropper组件实现图片切割上传
May 27 Vue.js
小程序点赞收藏功能的实现代码示例
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 json_encode中文乱码问题的解决办法
2013/09/09 PHP
Zend Framework教程之Application和Bootstrap用法详解
2016/03/10 PHP
laravel 5.4 + vue + vux + element的环境搭配过程介绍
2018/04/26 PHP
jQuery 学习第七课 扩展jQuery的功能 插件开发
2010/05/17 Javascript
Js获取事件对象代码
2010/08/05 Javascript
js判断IE6/IE7/FF的代码[XMLHttpRequest]
2011/02/16 Javascript
jQuery EasyUI API 中文文档 - DataGrid数据表格
2011/11/17 Javascript
关于跨站脚本攻击问题
2011/12/22 Javascript
jquery validate poshytip 自定义样式
2012/11/26 Javascript
html向js方法传递参数具体实现
2013/08/08 Javascript
图标线性回归斜着移动到指定的位置
2013/08/16 Javascript
js类型转换与引用类型详解(Boolean_Number_String)
2014/03/07 Javascript
Ext修改GridPanel数据和字体颜色、css属性等
2014/06/13 Javascript
JavaScript合并两个数组并去除重复项的方法
2015/06/13 Javascript
Bootstrap开发实战之第一次接触Bootstrap
2016/06/02 Javascript
省市选择的简单实现(基于zepto.js)
2016/06/21 Javascript
jQuery实现ajax的叠加和停止(终止ajax请求)
2016/08/08 Javascript
详解angularjs popup-table 弹出框表格指令
2017/09/20 Javascript
详解三种方式解决vue中v-html元素中标签样式
2018/11/22 Javascript
微信小程序canvas截取任意形状的实现代码
2020/01/13 Javascript
vue 解决在微信内置浏览器中调用支付宝支付的情况
2020/11/09 Javascript
python发送邮件的实例代码(支持html、图片、附件)
2013/03/04 Python
Pycharm学习教程(4) Python解释器的相关配置
2017/05/03 Python
使用Python写一个量化股票提醒系统
2018/08/22 Python
使用python opencv对目录下图片进行去重的方法
2019/01/12 Python
Python和Anaconda和Pycharm安装教程图文详解
2020/02/04 Python
H&M美国官网:欧洲最大的服饰零售商
2016/09/07 全球购物
五年级语文教学反思
2014/01/30 职场文书
护士自我鉴定怎么写
2014/02/07 职场文书
党员违纪检讨书怎么写
2014/11/01 职场文书
户外活动总结
2015/02/04 职场文书
2015夏季作息时间调整通知
2015/04/24 职场文书
报案材料怎么写
2015/05/25 职场文书
辩论赛开场白大全(主持人+辩手)
2015/05/29 职场文书
繁星春水读书笔记
2015/06/30 职场文书
聊聊SpringBoot自动装配的魔力
2021/11/17 Java/Android