【vue】几张图简单介绍一下index.js,index.html.App.vue等主页面的关系

最新推荐文章于 2023-03-26 15:29:46 发布
原创 最新推荐文章于 2023-03-26 15:29:46 发布 · 645 阅读 · 5 ·
本内容遵循CC 4.0 BY-SA版权协议
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
收录于
Vue

当前文章被收录于：

Vue
21 篇文章 1 人学习
订阅专栏 查看详情
本文详细介绍了Vue.js项目的基本文件结构，包括index.html、main.js、app.vue和index.js等核心文件的作用。main.js用于引入所有通用组件，而app.vue和index.js则分别负责应用的根实例和路由配置。

在这里插入图片描述

1、index.html

在这里插入图片描述

2、main.js

所有通用的组件都是在 main.js 里面引入的

在这里插入图片描述

3、app.vue

在这里插入图片描述

4、index.js

在这里插入图片描述

关于路由配置可以参考这个：

https://router.vuejs.org/zh/guide/essentials/dynamic-matching.html#%E5%93%8D%E5%BA%94%E8%B7%AF%E7%94%B1%E5%8F%82%E6%95%B0%E7%9A%84%E5%8F%98%E5%8C%96

贴一个在网上看到的文件目录结构图：

在这里插入图片描述

vue 指定index.html,vue history模式下进入到index.html 404
weixin_42543046的博客
06-11 1132
访问页面http://xxx/xxx/index可以正常访问但是访问http://xxx/xxx/index.html 就会跳到404这个是怎么回事啊:可不可以访问index.html也能进到首页回答首先，你的项目是vue的那么，index和index.html分别代表的不同路由，一个对一个错当然是正常的想要index.html也能访问的话你可以把router内添加对应的页面映射就行了，也就是说i...
ajax请求得到的数据怎么在另一个页面显示呢，两个都是html页面
qq_40999533的博客
09-11 6446
ajax请求得到的数据怎么在另一个页面显示呢，两个都是html页面 在做demo的时候涉及到前后端通过Ajax获取、提交数据，那么当我们在一个html页面的Ajax里获取数据后怎么在另一个HTML页面也获取到呢 现在我这儿有一个login.html页面和一个index.html页面 login.html提交数据到后台 后端在Controller层中处理返回json串，ajax的回调函数中获取后端传...
vue中config/index.js:配置的详细理解
zlzbt
11-19 7199
当我们需要和后台分离部署的时候，必须配置config/index.js: 用vue-cli 自动构建的目录里面 （环境变量及其基本变量的配置） 1 var path = require('path') 2 3 module.exports = { 4 build: { 5 index: path.resolve(__dirname, 'dist/index.html'), 6 assetsRoot: path.resolve(__dirname, 'dist'.
浅谈vue中index.html、main.js、App.vue、index.js之前的关系以及加载过程
热门推荐
天涯的博客
01-29 8万+
前序 承接上一遍“通过webpack构建vue项目”构建的项目文件，简单阐述一下当我们构建完成后，vue项目中的index.html、main.js、App.vue、index.js的运行加载过程，以及首界面是如何出现的，逐步了解vue项目，针对刚开始接触vue，不知道vue项目如何加载的小白，大神请绕过。 简介 项目部署完成后的项目结构以及解释如下图所示 项目运行 项目的运行入口i...
Vue中index.html、main.js、App.vue、index.js之前的关系及加载过程
wangshiqi666的博客
03-26 5960
Vue项目结构
VUE项目执行流程:index.html，main.js，App.vue，index.js之间调用关系
kalvin_y_liu的博客
06-04 1万+
关于Vue中main.js，App.vue，index.html之间关系进行总结
总结Vue中index.html、main.js、App.vue、index.js之间关系以及Vue项目加载流程
夜飘凌的博客
05-14 9695
总结Vue中index.html、main.js、App.vue、index.js之间关系以及Vue项目加载流程 文章目录总结Vue中index.html、main.js、App.vue、index.js之间关系以及Vue项目加载流程1 vue中index.html、main.js、App.vue、index.js关系简介1.1 项目的运行入口index.html1.2 入口文件main.js1.3 根组件App.vue1.4 控制路由index.js2 Vue项目加载流程 1 vue中index.html
【Vue】脚手架文件main.js、App.vue、index.html、index.js详解
Milk~每天分享一点点，技术进步一点点
10-25 4237
脚手架文件main.js、App.vue、index.html、index.js详解 学习Vue必定离不开vue-cli脚手架的运用，这里给大家梳理一下vue-cli的相关文件以及其调用关系 话不多说，直接上图 使用到vue项目的文件包括一个.html，两个.js，两个.vue文件，关系如上图所示 1、index.xml为vue项目默认首页，里面默认引用了App.vue根组件 2、main.js为vue项目的入口文件，加载了各种公共组件(需要引用和初始化组件实例) 比如App.vue main.js中
Vue | vue cli入口文件解析（main.js,app.vue,index.html webpack）
MGsniper的博客
01-15 2万+
在vue cli项目中，main.js是入口文件，定义了vue实例，并引入了整个项目的根组件app.vue，并将其挂载到index.html中id为‘app’的节点上。
Vue项目入口文件main.js和App.vue和index.html之间的关系
FurtherSkyQ的博客
04-08 1万+
刚开始接触Vue，说实话对Vue的运行逻辑其实不是很清楚，更多的是比较模糊，今天就先记录下Vue项目在初始化时做了做了什么。 1、在初始化的Vue项目中，我们最先接触到的就是main.js，App.vue，index.html这三个文件： index.html---主页，项目入口 App.vue---根组件 main.js---入口文件 那么这几个文件之间的联系如何呢？ 1.先看index.html中的内容：（为了很好的标识各个文件，我对各文件进行了文字标记） 2.在App.vu.
vue中main.js，App.vue，index.html，index.js之间关系进行总结
wfly blog
10-23 1888
index.html 项目的运行入口，在body体中只有一个div标签，其id为app，这个id将会连接到src/main.js内容 在浏览器打开的瞬间，浏览器中正文部分会瞬间显示index.html中定义的正文部分 上面有一个id为app的挂载点，之后我们的Vue根实例就会挂载到该挂载点上 <!DOCTYPE html> <html> <head> ...
Vue 项目中 main.js、App.vue、index.html、index.js 组件的作用
生化环材
03-05 5100
Vue 项目中 main.js、App.vue、index.html、index.js 组件的作用 index.html 项目的运行入口，在body体中只有一个 div 标签，其 id 为 app，这个 id 将会连接到 src/main.js 内容。 在浏览器打开的瞬间，浏览器中正文部分会瞬间显示index.html 中定义的正文部分。上面有一个 id 为 app 的挂载点，之后我们的 Vue 根实例就会挂载到该挂载点上 <!DOCTYPE html> <html> <h
Vue中main.js，App.vue，index.html之间关系进行总结
JavaAlliance
08-13 1343
在初始化的Vue项目中，我们最先接触到的就是main.js，App.vue，index.html这三个文件，我们从培训视频或者官方文档上可以了解到： index.html—主页，项目入口 App.vue—根组件 main.js—入口文件 那么这几个文件之间的联系如何呢？ 1.先看index.html中的内容：（为了很好的标识各个文件，我对各文件进行了文字标记） 2.在App.vue中，我做了如...
Vue中index.html、main.js、App.vue，之间关系
JavaAndLI的博客
09-15 2995
使用Vue 提供的官方的 CLI和构建工具webpack生成的vue项目，对于其中的main.js，App.vue，index.html这三文件之前的关系不是很明确，现在记录如下
vue项目中，main.js，App.vue，index.html的关系
郑金旭的博客
06-05 3957
一、main.js是我们的入口文件，主要作用是初始化vue实例，并引入所需要的插件 import Vue from 'vue' import App from './App' import router from './router' Vue.config.productionTip = false /* eslint-disable no-new */ new Vue({ el: '...
关于index.html app.vue main.js index.js这些事
zy_leslie的博客
07-16 1290
一、项目运行入口index.html 1、为什么index.html是项目的入口？ 2、为什么index.html加载后会继续加载main.js、App.vue、index.js？ 3、他们之间的关系是如何联系起来的？ ...... 回答：这块的配置文件位于文件夹下，包括webpack.dev.conf.js。通过项目的配置文件，可以加载运行我们的index.html文件以及自动关联vue...
vue中html、js、vue文件之间的简单引用与关系
dengying1570的博客
07-28 5004
有关vue文件记录：index.html在html中运用组件 <body> <app></app>　　<!-- 此处app的组件为入口js main.js中定义的组件名 --> <script src="build.js"></script>　　<!-- 此处引用的js为webpack...
vue中main.js、index.html、App.vue中的app是什么关系?
sunshineTing2的博客
07-14 1259
vue中的 main.js中app绑定的是index.html还是App.vue中？ 1.main.js是我们的入口文件，主要作用是初始化vue实例并使用需要的插件。 2.App.vue是我们的主组件，所有页面都是在App.vue下进行切换的。所有的路由也是App.vue的子组件。 3. main.js中的#app绑定了index.html的<div id="app"></div>， 并用App.vue内容替换div标签及其内容加载 // main.js import Vue fro
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值