【使用vue init和vue create的区别以及搭建vue项目的教程】

vue init

是vue-cli2.x的初始化方式，可以使用github上面的一些模板来初始化项目

webpack是官方推荐的标准模板名

使用方式：vue init webpack 项目名称

例如使用github上面electron-vue的模板

使用方式：vue init electron-vue 项目名称

教程目录：
一：《【vue init】使用vue init搭建vue项目》
二：《【vue init】项目使用vue-router,引入ant-design-vue的UI框架，引入less》
三：《【vue init】项目引入axios、申明全局变量、设置跨域》

---

vue create（使用vue ui界面也是这种）

是vue-cli3.x的初始化方式，模板是固定的，模板选项可自由配置

使用方式：vue create 项目名称

教程目录：
一：《【vue create】一.使用vue creat搭建项目》
二：《【vue create】二.配置Esline、less、nprogress、ant-design-vue、环境变量env、axios、vuex、Router、路由守卫以及登录页》

---

vue init和vue create的区别

vue init:

如果您想使用vue router、ESLint和unit/e2e测试，则只要求项目的一些元数据

目录截图：

目录说明：

build及config：webpack配置相关
node_modules:通过npm install安装的依赖代码库
src：项目源码
static：存放静态资源
.babelrc：babel相关配置（因为我们的代码大多都是 ES6，而大多浏览器是不支持ES6的，所以我们需要babel帮我们转换成ES5语法）
.editorconfig：编辑器的配置，可以在这里修改编码、缩进等
.eslintignore：设置忽略语法检查的目录文件
.eslintrc.js：eslint的配置文件
.gitignore：git忽略里面设定的这些文件的提交
index.html：入口html文件
package.json：项目的配置文件，用于描述一个项目，包括我们init时的设置、开发环境、生成环境的依赖插件及版本等。
package-lock.json：普通package.json文件“^2.0”这样写的，意味着版本可以大于等于2.0，如此就会出现各种错误。

package.json文件的区别

---

vue create:
您可以更方便地配置正在创建的新项目，它让您决定是使用标准选项还是手动选择您想要的（例如Babel、TypeScript、PWA支持等）以及其他一些选项

目录截图：

目录说明：

node_modules:通过npm install安装的依赖代码库
src文件夹：存放项目源码及需要引用的资源文件
.editorconfig：编辑器的配置，可以在这里修改编码、缩进等
.eslintignore：设置忽略语法检查的目录文件
.eslintrc.js：eslint的配置文件
.gitignore：git忽略里面设定的这些文件的提交
package.json：项目的配置文件，用于描述一个项目，包括我们init时的设置、开发环境、生成环境的依赖插件及版本等。
package-lock.json：普通package.json文件“^2.0”这样写的，意味着版本可以大于等于2.0，如此就会出现各种错误。
jsconfig.json独立的第三方配置文件
vue.config.js是一个可选的配置文件
public：有的叫assets：存放项目中需要用到的资源文件，css、js、images以及index
src-router文件夹:vue-router，路由器及路由的配置
src-store文件夹：存放 vue中的状态数据，用vuex集中管理
App.vue文件：使用标签渲染整个工程的.vue组件
main.js文件：vue-cli工程的入口文件

package.json文件的区别