vue.js框架搭建

安装脚手架vue

前提条件:已安装node(4.0版本以上),npmnode

a、全局安装 vue-cliwebpack

npm install -g vue-cli

安装成功后能够经过命令行查看版本号,如图web

b、初始化项目vue-router

新建一个文件夹命名为01vue,准备在此文件夹下存放项目,而后执行命令行 vue init 模板类型 项目名称 ,例:vue-cli

vue init webpack my-vue-project

vue有不少模板类型,例如webpack, simple, browserify,这里建立的是基于webpack的项目,回车后会有一系列的交互问题:npm

项目的名称,项目的描述,是否安装vue-router(用于页面跳转),是否采用ESLint(一个代码检测的工具,能够避免低级错误和统一代码风格),是否安装单元测试等,浏览器

能够一路enter到底,也能够本身选择,例:工具

而后能够发现01vue里面多了一个名为my-vue-project文件夹的文件夹单元测试

c、启动项目

按照上图提示的命令行来启动项目

cd my-vue-project
npm install
npm run dev

而后会看到文件夹里多了一个包含依赖包的文件夹 node_modules,最后在浏览器中输入地址 http://localhost:8080,能够看到第一个页面了^v^.