vue2 — 使用vue-cli创建vue2项目

• npm安装vue-cli

npm install -g vue-cli

• 创建vue2项目

vue init  
// template-name可选项：webpack、webpack-simple、browserify、browserify-simple、simple
// project-name: 创建项目的名称，缺省默认在当前目录初始化项目信息

vue-cli使用详情：https://github.com/vuejs/vue-cli

• 基于webpack创建的项目结构

  
  
  

  vue-cli初始化创建的项目结构

build: webpack打包相关配置信息
config: 环境配置信息
package.json: 依赖项配置文件
index.html: 首页
src: 项目源码存放
static: 静态资源文件存放目录
src/main.js: 入口文件
src/App.vue: App根节点

• 安装及运行

// 切入到项目目录
cd project-name  
// 安装依赖
npm install 
// 编译
npm run build
// 启动dev
npm run dev
或npm run start

启动后会自动在浏览器打开：http://localhost:8080/#/，显示以下画面：

启动效果

下一篇： vue2 — 根据需要做点改动