Vue CLI 创建的 Vue 项目解释

src\assets 目录

  这个目录存放静态文件

src\components 目录

  存放除 App.vue 以外的所有组件

src\main.js 文件

/*
  该文件是整个项目的入口文件
*/
// 引入 Vue
import Vue from 'vue'
// 引入 App 组件,它是所有组件的父组件(引入组件时,扩展名“.vue”写不写无所谓)
import App from './App.vue'

// 关闭生产提示
Vue.config.productionTip = false

new Vue({
  // 将 App 组件放入容器中
  render: h => h(App),
}).$mount('#app') // $mout 函数相当于用 el 配置绑定容器

public\index.html 文件

  这是整个应用的界面

<!DOCTYPE html>
<html lang="">
  <head>
    <meta charset="utf-8">
    <!-- 针对IE浏览器的特殊配置,含义是让IE浏览器以最高的渲染级别渲染页面 -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!-- 开启移动端的理想视口 -->
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <!-- 配置页签图标 -->
    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
    <!-- 配置网页标题 -->
    <title><%= htmlWebpackPlugin.options.title %></title>
  </head>
  <body>
    <!-- 当浏览器不支持 js 时,noscript 标签中的元素就会被渲染 -->
    <noscript>
      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
    </noscript>
    <!-- Vue 容器 -->
    <div id="app"></div>
    <!-- built files will be auto injected -->
  </body>
</html>

 

posted @ 2023-06-23 19:36    阅读(5)  评论(0编辑  收藏  举报