vue-cli脚手架创建vue项目

目录

前言

一、安装Node.js

二、安装webpack

三、安装vue-cli脚手架构建工具

四、通过vue-cli搭建项目

五、项目中各个文件夹目录说明

---

前言

一、安装Node.js

1.1 在官网下载node.js,根据自己电脑进行安装。在官网安装的node.js自带npm包管理器

1.2 测试node是否安装成功（node -v）

二、安装webpack

在控制台执行npm install webpack -g，安装完成之后执行webpack -v检测是否安装完成，出现版本号则显示安装成功。

三、安装vue-cli脚手架构建工具

在控制台中执行：npm install vue-cli -g进行安装，执行完后输入vue -V（V是大写）出现版本号则表示安装成功。

四、通过vue-cli搭建项目

完成以上步骤后我们需要的环境和工具已经安装完成，可以通过vue-cli搭建自己的项目了

1.创建一个机遇webpack的新项目

   打开控制台进入指定的项目文件夹，输入vue init webpack my-project（my-project是自定义的文件项目名，可以自定义。注意：不能使用中文）

等待一段时间执行完后，控制台进入创建项目的文件中执行npm run dev运行项目。

五、项目中各个文件夹目录说明

到此通过vue-cli就搭建出来了一个新的项目了

项目运行命令：npm run dev

项目打包命令：npm run build