Vue 使用vue-cli 构建一个新项目--单页面（学习）

一、安装 node 环境

1、下载地址为：https://nodejs.org/en/

　　1)、node 安装 —>移步 node 安装

　　2)、npm 安装  —>移步 npm 安装

2、检查是否安装成功

　　

　　

二、搭建 Vue 项目环境

1、webpack 安装

　　输入：npm install webpack -g

　　检查是否安装成功，输入：webpack -v

　　可能存在错误，webpack 单独分离出了 webpack-cli，需要我们安装 webpack-cli

　　

　　安装完成之后检查

　　

2、vue-cli 安装

　　1)、输入：npm install vue-cli -g

　　2)、检查 vue-cli 是否安装成功 ，不能检查 vue-cli，需要检查 vue

　　　　输入：vue list 或者 vue -V (v大写)

　　　　

三、创建一个基于 webpack 的 vue 新项目

　　进入项目要存放的目录

　　输入：F:

　　输入命令行：vue init webpack 项目名称 （项目名称不可以大写）

　　

　　创建完成，会出现以下操作指引

　　

　　运行成功

　　

　　#修改 config 文件夹下的 index.js , 项目启动是浏览器是否自启，改为 true 。

　　

 

　　

 

　　# 构建成功生成的文件目录

　　

　　#目录结构说明