使用vue-cli>=3版本自动生成vue.js+webpack的项目模板

什么是vue-cli

vue-cli是有Vue提供的一个官方cli，专门为单页面应用快速搭建繁杂的脚手架。它是用于自动生成vue.js+webpack的项目模板，是为现代前端工作流提供了 batteries-included的构建设置。只需要几分钟的时间就可以运行起来并带有热重载，保存时 lint 校验，以及生产环境可用的构建版本。

安装（全局）

注意，vue-cli都更多久都不知道了，不要再用旧版本安装了，如果看到其它教程还在用旧版本安装的话直接不用看了。
官网那么棒那么全就别在百度找过期教程了。

旧版本：npm install –g vue-cli
新版本：npm install -g @vue/cli

创建项目

命令：vue create my-project

Vue-cli官网 创建一个项目

由于vue-cli3将webpack的基础配置全部内嵌了，这就导致我们初始化项目完成之后发现原先的webpack的config配置全部都消失不见了，那该怎么办呢？别慌，vue-cli3早就考虑到了这一点，它预留了一个vue.config.js的js文件供我们对webpack进行自定义配置。请看下文：

vue-cli3搭建项目之webpack配置

vue CLI >= 3 和旧版使用了相同的 vue 命令，所以 Vue CLI 2 (vue-cli) 被覆盖了。如果你仍然需要使用旧版本的 vue init 功能，你可以全局安装一个桥接工具：

npm install -g @vue/cli-init
# `vue init` 的运行效果将会跟 `vue-cli@2.x` 相同
vue init webpack my-project

运行项目

执行创建项目命令后会自动安装所有需要的包，完成后在项目文件夹下运行以下代码：

npm run serve

项目结构介绍

请看下一篇 vue-cli生成的项目代码结构介绍