脚手架安装的问题：

1.安装node.js,配置环境变量,cmd输入node -v和npm -v可以看到版本号（如果显示不是命令，确认环境变量是否配置成功，记得配置环境变量之后重新打开cmd，再去验证）

2.在安装cnmp时，大堆错误提示，记得以管理员身份打开cmd，在安装东西

3.在创建脚手架时，cmd中在索要创建脚手架项目的文件夹目录下输入vue create myvue1

4.运行main.js文件，右键->open in Integrated Terminal（或快捷键ctrl+~），打开终端，

在终端中输入：npm run serve

 如果出现错误，提示没有脚本权限

解决方法：参考（npm : 无法加载文件 C:\Program Files\nodejs\npm.ps1，因为在此系统上禁止运行脚本。有关详细信息，请参阅 https:/go.microsoft.com/fwlink-CSDN博客），我这个执行到第二步就可以解决了

 默认插槽：

实现效果：

代码：

App.vue:

<template>
	<div class="container">
		<Category title="美食">
			<img src="../images/flower.jpg" alt="">
		</Category>
		<Category title="游戏">
			<li v-for="(item, index) in games" :key="index">
				{{ item }}
			</li>
		</Category>
		<Category title="电影">
			<video controls src="../images/school.mp4"></video>			
		</Category>
	</div>
</template>

<script>
import Category from './components/Category.vue';

export default {
	name:'App',
	components:{Category},
	data(){
		return {
			foods:['鱼','虾'],
			games:['你好','你好好'],
			films:['猪猪侠','武林外传']
		}
	}
}
</script>

<style>
/* img、video放这里或者Category都行 */
img {
    width: 100%;
}
video {
    width: 100%;
}
</style>

Category.vue

<template>
  <div class="category">
    <h3>{{ title }}分类</h3>
    <!-- 插槽 -->
    <slot>我是默认插槽，当没有内容时，我就会出现</slot>
  </div>
</template>

<script>
export default {
    props:['title','listData']

}
</script>

<style>
.category {
    background-color: skyblue;
    width: 200px;
    height: 300px;
    float: left;
    margin-left: 20px;
}
.category h3 {
    text-align: center;
    background-color: orange;
}
.category li {
    padding-left: 30px;
}
</style>