VUE，vue-cli项目结构，以及在vue-cli脚手架原始项目框架引入模块

一、项目结构：

初始化一个vue-cli之后，我们可以在目录中看到以下结构。

app.vue

src下的app.vue是项目的根组件，可以包含其他的子组件。在项目运行时进入的首页即为app.vue。子组件写在src文件夹下的components内。根组件和子组件组成组件树。

main.js

mian.js是vue应用的入口文件，可以创建一个新的vue实例并挂载再根节点下。Vue插件也从这里引入。

二、添加引入新模块

1.在components文件夹下新建一个vue文件

模块内基本组件：

• template，在里面添加模块可视内容
• script,使用export default将模块导出
• style,控制组件样式，建议在后面加一个scoped避免样式影响到其他组件

例子：创建student.vue

<template>
  <div id="student">
    <h3