Vuejs开发环境搭建及热更新【推荐】
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
通过访问访问运行起来的项目。
三、参考链接
vuejs官网:
taobao镜像:
总结
以上所述是小编给大家介绍的vuejs开发环境搭建及热更新,希望对大家有所帮助