如何创建一个Vue2.0项目

如何创建一个Vue2.0项目

一、环境准备

1. 安装Node.js

//	1.根据自己的电脑配置下载
//	2.下载LTS稳定版即可

2. 检查是否安装成功

//	1.Win+R
//	2.输入CMD
//	3.输入node -V
//	4.回车

二、搭建Vue环境

1. 全局安装 vue/cli

2. 命令行输入

npm install -g @vue/cli
# OR
yarn global add @vue/cli

3. 检查是否安装成功

//	1.Win+R
//	2.输入CMD
//	3.输入vue --version
//	4.回车

4. 是否要更新

//	1.如果安装了，可以更新
npm update -g @vue/cli
# OR
yarn global upgrade --latest @vue/cli

三、创建Vue项目

1. 创建项目

以管理员身份打开命令行界面，进入任意一个想要创建项目的文件夹

//	1.Win+R
//	2.输入CMD
//	3.输入vue create my-object
//	4.回车

注意：my-object是项目名称

2. 进入项目

//	1.cd my-object
//	2.回车

3. 启动项目

VSCode打开项目文件，查看package.json项目依赖的script配置项

//	1.项目启动
npm run serve

4. 项目结构

|-node_modules 			依赖包
|-public  				包含会被自动打包到项目根路径的文件夹
	|-favicon.ico  		页面标题图标
	|-index.html		唯一的页面
|-src
	|-assets  			组件中需要使用的公用资源
	|-components  		公共非路由组件
	|-App.vue  			应用根组件
	|-main.js  			入口js
|-babel.config.js		js编译器，ES5转ES6
|-jsconfig.json			js的配置文件
|-package-lock.json  	当前项目依赖的第三方包的精确信息
|-package.json  		当前项目包信息
|-README.md				git仓库的md文档
|-vue.config.js			vue相关的配置(如: 代理服务器等)