使用Vue脚手架（一）创建脚手架&脚手架的结构&render函数&修改默认配置

1.创建脚手架

*全局安装：

   第一步：配置npm淘宝镜像：

npm config set registry https://registry.npm.taobao.org

   第二步：全局安装脚手架：

      npm install -g @vue/cli

   第三步：切换到你要创建项目的目录，然后使用命令创建项目：

      vue create xxxx

2.脚手架的结构

*.gitignore：git的忽略文件，配置不想被git管理的文件

*babel.config.js：

*package.json：包的说明书

* package-lock.json：包版本控制文件

*src：

   main.js：npm run serve最先执行的文件，整个项目的入口文件

// 引入vue
import Vue from 'vue'
//引入App组件，是所有组件的父组件
import App from './App.vue'
//关闭vue的生产提示
Vue.config.productionTip = false
//创建vue的实例对象
new Vue({
  // 将App组件放入容器中
  render: h => h(App),
}).$mount('#app') 

App.vue：父组件

   assets：存放静态资源

   components：存放组件

*public：index.html：进入页面

3.render函数

* vue.js与vue.runtime.xxx.js的区别：

   (1).vue.js是完整版的Vue，包含：核心功能+模板解析器。

   (2).vue.runtime.xxx.js是运行版的Vue，只包含：核心功能；没有模板解析器。

*因为vue.runtime.xxx.js没有模板解析器，所以不能使用template配置项，需要使用render函数接收到的createElement函数去指定具体内容。

4.修改默认配置

* Vue 脚手架隐藏了所有 webpack 相关的配置，若想查看具体的 webpakc 配置，执行：vue inspect > output.js

*修改执行入口：

第一步：在根目录下创建vue.config.js

第二步：vuecli配置参考