前端开发中提到的“脚手架”是一个形象的比喻，比喻各类语言的前期工作环境。
在软件开发上（当然也包括前端开发）的脚手架指的就是：有人帮你把这个开发过程中要用到的工具、环境都配置好了，你就可以方便地直接开始做开发，专注你的业务，而不用再花时间去配置这个开发环境，这个开发环境就是脚手架。
比如vue.js就有个vue-cli脚手架，基于node.js的开发环境，作者帮你把开发环境大部分东西都配置好了，你把脚手架下载下来就可以直接开发了，不用再考虑搭建这些工具环境。
Vue是：构建用户界面的渐进式框架，可以自底向上逐层应用（大概是这个意思？由基层开始做起，把基础的东西写好，再逐层往上添加效果和功能。）
（前期刚学时不建议直接安装vue-cli脚手架，可以直接通过<script></script>引入，如：<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>然后直接用就行了）
1.首先Windows+R 打开cmd；输入npm -v 和node -v 检测是否安装了npm和node.js，没安装先去安装node.js（npm是随node.js一起安装的包管理工具，就不用安装了）附上node.js安装地址：
2.然后还需要淘宝镜像安装cnpm和webpack支撑（有时候安装依赖特别慢 就会用到cnpm）
淘宝镜像安装cnpm命令：
安装之后 执行cnpm -v，如果出现相应的版本号就是安装成功
webpack安装命令：
安装之后 执行webpack -v，它会问你：
直接回车就可以，然后再执行webpack -v，如果出现相应的版本号就是安装成功
3.最后就是安装vue-cli脚手架了
vue-cli脚手架安装命令：
安装之后 执行 vue -V ，如果出现相应的版本号就是安装成功
4.用vue-cli创建一个基于webpack的新项目并运行
首先可以在桌面新建一个文件夹，如：Vue
然后执行cd Vue 进入文件夹，然后输入以下命令新建项目，回车
然后根据提示一路回车，这时文件夹下就会有很多相关文件了
最后用cnpm安装依赖：
最后的最后 就是运行项目啦 输入以下命令：
或者以下命令也可以：
如果成功的话，一般就是提醒你可以在浏览器地址栏输入以下地址就能正常访问了
至此，应该就可以正常访问一个新建的项目了，接下来的就是在新项目中通过组件、事件、指令等等丰富项目。
本文根据vue.js官方文档学习总结。附上官方文档：
build：webpack配置文件config：webpack配置文件
node_modules：安装的依赖包
src：所有的组件都写在里面
static：所有第三方的静态资源存放目录
.babelrc：babel的一些配置（比如将es6编译成es5的一些配置）
.editorconfig：编辑器的一些配置（包括编码格式，缩进风格，换行格式）
.gitignore：配置Git仓库忽略的一些文件（不会上传）
.postcssrc.js 配置postcss的文件（主要是css样式兼容性，自动加前缀（autoprefixer））
index.html：入口html文件。
package.json: 项目的一些配置信息（项目的一些具体信息）
package-lock.json就是锁定安装时的包的版本号，并且需要上传到git，以保证其他人在npm install时大家的依赖能保证一致。
autoprefixer：是用于给css3属性自动加属性前缀的
babel系列都是处理语法的
chalk：适用于格式化输出命令行信息的，比如run dev以后的start...
copy-webpack-plugin：在webpack中拷贝文件和文件夹
extract-text-webpack-plugin：为了抽离css样式，防止将样式打包在js中引起页面样式加载错乱的现象
file-loader：操作文件
friendly-errors-webpack-plugin：能够更好在终端看到webapck运行的警告和错误
html-webpack-plugin ：插件的基本作用就是生成html文件
node-notifier：来发送桌面消息,包括应用状态改变以及错误信息
optimize-css-assets-webpack-plugin：压缩提取出的css，并解决ExtractTextPlugin分离出的js重复问题(多个文件引入同一css文件)
ora：命令行里自动运行的信息提示
portfinder：可以帮你找出正在运行的进程打开了哪些端口
rimraf：跑shell命令 rm-rf 的工具
semver：是用来对特定的版本号做判断的(check-version.js)中
shelljs：selljs是在node里跑shell命令的工具，比如‘rm -rf’在(check-version.js)中，属于Unix命令
uglifyjs-webpack-plugin：压缩js
webpack：打包工具
webpack-bundle-analyzer：打包优化工具，可得到一个可视化模块大小界面
webpack-dev-server：配合webpack，创建开发环境（启动服务器、监视文件变化、自动编译、刷新浏览器等），提高开发效率
webpack-merge：合并
