使用vue-cli安装vue架子及文件目录解析

vue-cli即vue脚手架，可以用于快速构建vue项目，这里将为大家介绍如何使用vue-cli构建项目，及构建出来的项目文件解析

工具/环境

方法/步骤

1

如果没有安装vue-cli

执行命令：npm install -g vue-cli进行vue脚手架的安装

-g代表安装到global目录，如图

2

运行：vue init webpack 你的项目名称

利用脚手架快速构建项目

Project name :项目名称 Project description:项目描述sAuthor：作者，如果你有配置git的作者，他会读取。
Install vue-router? 是否安装vue的路由插件Use ESLint to lint your code? 是否用ESLint来限制你的代码错误和风格setup unit tests? 是否需要安装单元测试工具aSetup e2e tests with Nightwatch?是否安装e2e来进行用户行为模拟测试

3

执行命令

cd  你的项目目录名称

进入项目目录

npm run dev

编译项目

4

编译完毕，打开浏览器，输入localhost:8080

出现以下页面，表示编译成功

5

在使用脚手架的时候，首先我们要知道脚手架给我们布置了一个怎样的目录架构，如图。


6

解说完毕，希望能帮助到大家

教程结束。