引导者本文目录一览：
vuecli如何使用
搭建完成后的文件目录是这样子的 首先使用npm install --save-dev vuex 把vuex添加到依赖，接下来就是如何在组件中使用vuex，大体上来说有以下两种形式。
下面正式开始搭建vue-cli脚手架。命令行工具命令行工具是我们操作npm的基础，这个必须要有的，很多教程没有写清楚，那些教程一上来就贴上一大堆命令，当初也不知道在哪里使用命令行工具。
方式一webpack配置 webpack安装参考安装 webpack 中文网直接在packagejson同级目录下创建创建一个webpack的配置文件即可，然后在配置文件内输入内容方式二vuecli配置 vuecli目前已不。
vuecli版本和node版本的关系
原因是VueCLI版本的问题，Node.js版本的问题，网络连接问题，本地环境问题。VueCLI版本的问题：Vue3需要使用VueCLI0及以上版本，如果使用的是旧版本的VueCLI，可能会导致配置失败。
Vue.js 是一种基于 JavaScript 的前端框架，它的运行需要依赖于浏览器环境以及一些构建工具和开发环境。而 Node.js 是一种基于 JavaScript 的后端开发平台，它提供了一些用于服务器端开发的 API 和工具。
win7最高支持nodejs114版本vue-cli。Windows7是由微软公司（Microsoft）2009年10月22日发布的桌面端操作系统[4]，内核版本号为WindowsNT1。Windows7可供家庭及商业工作环境的笔记本电脑、多媒体中心等使用。
vue-cli脚手架的优势：有一套成熟的vue项目架构设计，能够快速初始化一个Vue项目.vue-cli是官方支持的一个脚手架，会随本版本进行迭代更新。
一般就是这样：本人测试vue-cli，使用的各个工具的版本，分别是node9webpack0、vue4。第一步，安装node.js。PS：我所使用的系统是win7的64位。
vue-cli相当于脚手架， 给你自动生成模板工程 ；vue-router是 vue路由插件， 支持你单页应用的 ；vue-loader是webpack下loader插件， 可以把.vue文件 输出成组件。
vue和vue-cli是什么关系?
vue脚手架指的是vue-cli，它是一个专门为单页面应用快速搭建繁杂的脚手架，它可以轻松的创建新的应用程序而且可用于自动生成vue和webpack的项目模板。Vue是一个用于构建用户界面的渐进式框架。它是可以自底向上逐层应用。
vue-cli你一个基于vuejs的脚手架，是用来创建项目的，而vuejs是一个框架。
Vue全家桶一般来说指的是脚手架vue-cli、路由vue-Router、状态管理模式vuex、Axios、elementUI等ui框架和打包工具webpack。vue-cli也叫脚手架，官方定义为Vue.js开发的标准工具。
检测cnpm是否安装成功 vue-cli是vue脚手架工具，方便打包，部署，测试等。
VueCLI3打包优化--抽离依赖包
可根据环境变量vuecli，仅在线上采取使用CDN，开发环境直接使用npm依赖包即可。
通过配置vue-cli把一些平常不需要用的包排除在打包文件之外。
地址链接：vue-cli 如何打包上线先来描述一下期间遇到的问题有哪些：打包后将 dist 文件夹和 index.html 放到 tomcat，在浏览器中访问时，出现空白页，f12 提示 404。
再优化下去的话，vuecli我们要知道webpack打包的过程中做vuecli了啥，首先是解析依赖啦，然后就是各种各样的loader。
production 可根据当前环境写死，也可在环境配置文件中，加入打包到的文件夹名（有多个环境的时候比较方便）。vue.config.js 配置 打包出来的文件不提交到 git 的话，配置 .gitignore。
