vue主要的三个文件和关系

已于 2022-03-03 03:30:07 修改
阅读量229 收藏
点赞数
文章标签： vue.js
于 2022-03-03 03:20:15 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/zhuyuan123456/article/details/123244449
版权

我们先来看下图

watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBASlNPTlDvvIQ=,size_20,color_FFFFFF,t_70,g_se,x_16

 我们再来看下main.js这个入口里面放的代码，因为webpack打包，也是从这儿开始的

watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBASlNPTlDvvIQ=,size_20,color_FFFFFF,t_70,g_se,x_16也就是，说，当我们执行了yarn serve这个命令的时候，其实就是执行了，webpack开发服务器这个功能！

 

 

我们再来看一下app.vue里面的代码

watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBASlNPTlDvvIQ=,size_20,color_FFFFFF,t_70,g_se,x_16

 这是对helloword.vue的一个引入！

 

我们再来看一下index.html

watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBASlNPTlDvvIQ=,size_20,color_FFFFFF,t_70,g_se,x_16

 

 

小结一下

watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBASlNPTlDvvIQ=,size_20,color_FFFFFF,t_70,g_se,x_16

 

 

 

 

 

JSONP＄
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Vue项目入口文件main.js和App.vue和index.html之间的关系
FurtherSkyQ的博客
04-08 9035
刚开始接触Vue，说实话对Vue的运行逻辑其实不是很清楚，更多的是比较模糊，今天就先记录下Vue项目在初始化时做了做了什么。 1、在初始化的Vue项目中，我们最先接触到的就是main.js，App.vue，index.html这三个文件： index.html---主页，项目入口 App.vue---根组件 main.js---入口文件 那么这几个文件之间的联系如何呢？ 1.先看index.html中的内容：（为了很好的标识各个文件，我对各文件进行了文字标记） 2.在App.vu.
Vue简单项目文件夹和文件联系
weixin_41657954的博客
12-11 1223
Vue简单项目文件夹和文件联系 这是我创建好了的Vue基础项目截图 我们一般在src文件夹中玩Vue 首先说一哈我对Vue的简单理解，Vue是前端的一种技术框架，浏览器上显示的东西其实还是html文件，为什么这么说，且看我慢慢道来： 先看public文件夹下的index.html文件中的 所对应的是src文件夹下的main.js中的$mount('#app') （下图的api，util是我后边创建的，忽略不看，App1.vue是我改了的，原本是App.vue,改了后看起来更容易对比看） ![在这里插入图
vue项目文件介绍_vue文件(1)
2401_85123508的博客
06-15 1029
资料过多，篇幅有限自古成功在尝试。不尝试永远都不会成功。勇敢的尝试是成功的一半。速度，package-lock.json目的就是确保所有库包与你上次安装的完全一样。如果要升级package-lock.json里面的库包[外链图片转存中…(img-19MIe9Rm-1718461999847)][外链图片转存中…(img-5OOJkQWv-1718461999848)]资料过多，篇幅有限自古成功在尝试。不尝试永远都不会成功。勇敢的尝试是成功的一半。
axios和vue-axios之间的关系
JackieDYH的博客
06-15 1158
axios是一个库，并不是vue中的第三方插件，使用时不能通过Vue.use()安装插件，需要在原型上进行绑定 $cnpm install --save axios
解析vue.config.js文件
韩旭不会敲代码吧的博客
04-23 2557
解析vue.config.js文件
Vue 组件和、页面、控件 三者的关系
dawfwafaew的博客
02-27 1658
Vue 组件和、页面、控件 三者的关系
Vue2和Vue3
秋书一叶的博客
08-26 6621
Vue.js 2（通常称为Vue 2）是一款流行的JavaScript前端框架，用于构建现代、交互式、响应式的用户界面。它由Evan You开发，于2016年发布，是Vue.js框架的第二个主要版本。Vue 2的核心思想是将数据驱动和组件化开发相结合，使开发者能够更轻松地构建复杂的Web应用程序。Vue 2主要包含以下特点和特性：组件化架构： Vue 2采用组件化的开发方式，将界面拆分为多个可重用的组件。每个组件具有自己的状态、模板、方法和生命周期钩子，使得开发更具模块化、可维护性更高。
vue-cli是什么？和 webpack是什么关系？
炑焽的博客
06-10 1128
Vue CLI是Vue.js项目的官方脚手架，基于Node.js与Webpack构建。安装Vue CLI前需确保Node.js已安装，随后通过npm全局安装。Vue CLI能迅速创建和管理Vue.js项目，提升开发效率。而Webpack则负责资源打包，通过配置文件管理依赖、插件等，优化代码并分割资源，提高项目性能。Vue CLI与Webpack的完美结合，让开发者更专注于业务逻辑，轻松构建高效、稳定的Vue.js应用。
Vue 组件的三大组成部分
体系化很难，碎片归纳很简单。
05-02 1172
Vue 组件通常由三大组成部分构成：模板（Template）、脚本（Script）、样式（Style）模板部分是组件的 HTML 结构，它定义了组件的外观和布局。Vue 使用基于 HTML 的模板语法来声明组件的模板，可以插入动态数据、绑定事件等。脚本部分包含了组件的 JavaScript 代码，用于定义组件的行为逻辑。在脚本中，可以定义组件的数据（data）、计算属性（computed）、方法（methods）等。样式部分定义了组件的样式，用于控制组件的外观和样式。
Vue中一个文件中配置多个组件
SUMMERENT的博客
07-15 1690
使用Vue.extend(options)创建，其中options和NewVue（options）时传入的那个options几乎一样，但也有区别区别如下1、el不要写，为什么？-----最终所有的组件都要经过一个vm管理，由vm中的el决定服务的是哪个容器2、data必须写成函数，为什么？----避免组件被复用时，数据存在引用关系。...
vue 引用src中的文件_Vue中引用第三方JS文件
weixin_39634997的博客
12-22 1270
使用Vue时会经常使用jQuery、bootstrap这类第三方工具库，而boostrap的渲染不仅依赖于jQuery js文件的加载，也依赖于HTML中DOM树内容的加载。但Vue中DOM树是有Vue的app.js动态生成，因此js文件的引用顺序关系boostrap是否能够渲染成功。以下没有贴所有的代码，可能有信息缺失引起歧义，可以发送邮件到hugh@inner-peace.cn咨询和探讨。遇到...
将一个vue文件编译成js文件的工具
08-12
`.vue` 文件包含模板、脚本和样式三个主要部分，这使得代码结构清晰，易于管理和维护。然而，在实际的项目部署过程中，我们需要将这些 `.vue` 文件转换为浏览器可识别的 JavaScript 文件。这就涉及到了Vue.js的构建...
简单的vue三级联动下拉框代码
06-11
在三级联动中，有三个下拉框，它们之间存在依赖关系，选择一级会影响二级，选择二级会影响三级。 二、实现原理 1. 数据驱动：Vue.js 使用数据绑定（`v-model`）将UI与数据模型关联，当数据变化时，视图会自动更新；...
vue2.0开发入门笔记之.vue文件的生成和使用
08-29
`.vue` 文件将 HTML、CSS 和 JavaScript 三者封装在一个文件内，使得组件化开发更为便捷。以下是对 `.vue` 文件生成和使用的详细说明： 1. **组件封装**： - `.vue` 文件是一个自包含的组件，它可以包含模板...
vue 查看dist文件里的结构(多种方式)
10-15
这样，在打包时，会自动生成一个本地服务器，显示所有生成文件的关系图，直观地呈现了各个模块的大小和依赖关系，方便进行性能优化。 **其他推荐：在线分析工具** 除了上述方法，还有许多在线工具可用于分析打包...
浅谈vue 单文件探索
12-11
`.vue` 文件包含三个主要部分： - **模板（Template）**：使用 HTML 描述组件的结构，可以享受 IDE 提供的语法高亮和智能提示。 - **脚本（Script）**：定义组件的逻辑，可以使用 ES6+ 特性，甚至支持 TypeScript。...
在Vue程序中，如何检测用户的登录状态并跳转到对应页面
exlink2012的专栏
07-25 397
通过以上步骤，你可以在Vue应用程序中检测用户的登录状态，并在用户尝试访问受保护页面时跳转到登录页面。同时，在用户登录和登出后，你可以根据需要跳转到相应的页面。
vue单页面 全屏 使用 screenfull 实现全屏（左侧菜单栏隐藏）
最新发布
m0_71835253的博客
07-25 519
vue单页面 全屏 使用 screenfull 实现全屏（左侧菜单栏隐藏）_vue在打开一个界面的时候隐藏侧边栏-CSDN博客
VUE中的重点*
qq_61132537的博客
07-22 1091
实际上就是一个闭包，因为vue是单页面应用，是由很多组件构成，每一个组件中都有一个data， 所以通过闭包给每一个组件创建了一个私有的作用域，这样就不会相互影响。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值