vue项目目录结构说明

vue文件说明

1、main.js是我们的入口文件，主要作用是初始化vue实例，并使用我们需要的插件   

import Vue from'vue'
import App from'./App'
import router from'./router'
/* eslint-disable no-new */

    new Vue({
        el:'#app',
        router,
        template:'',
        components: { App }
    })

2、App.vue是我们的根组件，所有页面都是在App.vue下面进行切换的，可以理解为所有的组件都是App.vue的子组件，我们可以把头部和底部及每个页面都出现的内容放在App.vue里面。

import Hello from './components/Hello'
    export default {
        name: 'app',
        components: {
        Hello
        }
    }

#app {
    font-family: 'Avenir', Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-align: center;
    color: #2c3e50;
    margin-top: 60px;
}

import Hello from'./components/Hello'exportdefault{ name:'app', components: { Hello }}
import Hello from'./components/Hello'exportdefault{ name:'app', components: { Hello }}

3、index.html文件入口

4、src放置组件和入口文件，也是我们写代码的目录

5、node_modules为依赖的模块

6、config中配置了路径端口值等

7、build中配置了webpack的基本配置、开发环境配置、生产环境配置等

#app{font-family:'Avenir', Helvetica, Arial, sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-align:center;color:#2c3e50;margin-top:60px;}