Vue 脚手架中几个重要的文件

src 文件夹

main.js

main.js 该文件是整个项目的 入口文件

此处引入 Vue,引入 App 组件,关闭 vue 的生成提示,创建 Vue 实例对象


App.vue

App 组件是所有组件的父组件:导入所有组件注册、使用

<template>
    <!-- 使用静态资源 -->
    <img alt="Vue logo" src="./assets/logo.png">
    <!-- 使用组件 -->
    <HelloWorld msg="Welcome to Your Vue.js App"/>
</template>

<script>
    // 导入组件
    import HelloWorld from './components/HelloWorld.vue'

    export default {
        name: 'App',
        components: {
            // 注册组件
            HelloWorld
        }
    }
</script>

<style>
    #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;
    }
</style>

components 文件夹

存放所有组件


assets 文件夹

存放静态资源:图片、视频、音频



public

favicon.ico

网站的页签图标


index.html

创建 app 容器



posted @ 2022-04-29 10:46  春暖花开鸟  阅读(39)  评论(0编辑  收藏  举报