前言在「Vue3」中，创建一个组件实例由 createApp 「API」完成。创建完一个组件实例，我们需要调用 mount() 方法将组件实例挂载到页面中：createApp({
...
}).mount("#app");在源码中整个组件的创建过程:mountComponent() 实现的核心是 setupComponent()，它可以分为两个过程：开始安装，它会初始化 props、slo
源码分析vue computed在阅读本文之前，建议先了解vue响应式原理和watch侦听器相关原理，可以看一下源码分析vue响应式原理 和源码分析vue watch侦听器，将有助理解computed。用法示例var vm = new Vue({
el: '#app',
data: {
message: 'Hello'
},
computed: {
这一节，依然是深入剖析Vue源码系列，上几节内容介绍了Virtual DOM是Vue在渲染机制上做的优化，而渲染的核心在于数据变化时，如何高效的更新节点，这就是diff算法。由于源码中关于diff算法部分流程复杂，直接剖析每个流程不易于理解，所以这一节我们换一个思路，参考源码来手动实现一个简易版的diff算法。之前讲到Vue在渲染机制的优化上，引入了Virtual DOM的概念，利用Virtual
vue源码
1. 请说一下Vue2响应式数据的理解先知道基本的问题在哪源码的角度回答你用的时候有哪些问题可以监控一个数据的修改和获取操作。针对对象格式会给每个对象的属性进行劫持 Object.defineProperty源码层面 initData -> Observer -> defineReactive 方法（内部对所有的属性进行了重写 性
转载
2024-05-21 05:57:26
267阅读
1.vue打包的问题 一次在两个电脑中给同一个项目打包，打出来dist文件的不一样打，一个15.7M ,一个3.7M，同样的代码，同样的命令，为什么打出来的包差别这么大。查了一下代码，发现vue.config.js这个文件不同。在create vue的时候，这个文件没有被创建，需要自己手动添加，内容如下module.exports = {
productionSourceMap: fal
转载
2024-07-02 21:25:38
74阅读
Vue本地应用前言内容绑定，事件绑定v-text指令v-html指令v-on指令基础案例练习：计数器显示切换，属性绑定v-showv-ifv-bind案例练习：图片切换列表循环，表元素绑定v-forv-on补充v-model案例练习：记事本小结 前言本文是Vue框架学习的第二部分-Vue的本地应用，从“内容绑定，事件绑定”，“显示切换，属性绑定”，“列表循环，表元素绑定”三个方面学习v-text
vue中使用amap这几天被公司要求在APP端做出一个地图，且在地图上来显示不同公司的详细信息的功能。众所周知，人们在面对一个新的陌生事物时，可能会有一种陌生以及不安的心理（ps: 那些大佬当我没说），俺也一样。所以记录一下本次做地图的一些细节以及具体做法。那么废话不多说，直接开始吧。一： 首先得知道地图的基本展现（你得能先让地图主体出来，在搞其他）1.1 安装 （ 官方链接：https://el
由于前几篇文章是用vue-cli直接分析的，今天我们学习直接调试vue源码。安装vue（mac机)1.在GitHub上克隆官方的vue-地址 2.安装依赖npm install修改vue项目1.在package.json script dev 增加--sourcemap指令"dev": "rollup -w -c scripts/config.js --environment TARGET:web
我们上次学习了vue数据驱动的概念，以及简单的vue怎么知道数据更新，然后采取行动的。今天我们就来继续深入学习，vue怎么把数据和视图给绑定在一起的，数据发生变化，视图怎么会自动发生变化的。
原创
2023-06-24 00:11:41
108阅读
开发vue（或类似的MVVM框架）的过程中，需要面对的主要问题有哪些？剖析vue实现原理，自己动手实现mvvm官网介绍
转载
2016-12-23 07:49:00
75阅读
2评论
一、vue架构简介 我们创造的vnode，本质上是一个js对象，所以操作vnode比操作真实dom的lelement元素，要简单很多很多； 通过render函数将template转化为vnode（本质是一个js对象），然后通过渲染器将将vnode转化为真实元素 二、三大系统 第一部分是compile ...
转载
2021-09-23 16:48:00
612阅读
2评论
Vue学习杂记（六）——项目构建与sourceMap一、项目发布1.1构建生产模式1.2配置clean-webpack-plugin插件1.3对webpack安装的插件的管理二、sourceMap的配置 一、项目发布1.1构建生产模式 webpack打包的最后一步便是发布了，首先在package.json文件的"scripts"中添加如下脚本名称和webpack打包方式："build":"
转载
2024-04-25 15:03:26
200阅读
一、vue架构简介 我们创造的vnode，本质上是一个js对象，所以操作vnode比操作真实dom的lelement元素，要简单很多很多； 通过render函数将template转化为vnode（本质是一个js对象），然后通过渲染器将将vnode转化为真实元素 二、三大系统 第一部分是compile ...
转载
2021-09-23 16:48:00
293阅读
2评论
sourceMap到底是个啥玩意？一、前言sourceMap是一个由来已久的名词，自从2013年jQuery开始支持以来，开始逐渐广泛的被应用于各种打包工具上，最具标志性的便是前端er必须具备的webpack。webpack是一个模块打包工具，在使用的过程中有许多配置项可以选择，例如：source-map、cheap-module-source-map、cheap-source-map、eval-
一、 配置 proxy 跨域module.exports = {
devServer: {
open: true, // 自动启动浏览器
host: 'localhost', // localhost
port: 8080, // 端口号
hotOnly: false, // 热更新
overlay: {
// 当出现编译器错误或
写在最前面拥有全球数据库国内好像就只有百度地图有，高德、搜狗、腾讯的都不行，但是由于百度地图的数据更新不及时，所以在做相关项目要用到国外数据的时候，最好还是推荐使用bingMap。bing Map 使用教程（基础）参考文档： bing Map 官方教程bing Map 初始化引入bing map资源<script type='text/javascript' src='http://ww
HashMap 源码中主要了解其核心源码及实现逻辑。ConcurrentHashMap 就不再重复那些数据结构相关的内容咯，这里重点看一下它的并发安全实现。源码如下。public class ConcurrentHashMap<K,V> extends AbstractMap<K,V> implements ConcurrentMap<K,V>,
Seri
1、首先我们看看通过vuejs脚手架工具生成项目配置文件config/index.js文件，通过看配置我们可以看到这样一项配置，productionSourceMap: true这个配置的作用用于是否生成source map文件。当配置为true时，在打包的过程中会生成source map文件，从而帮助调试代码。但是在我们发布代码的时候是已经调试好的代码，所以生成source map意义不大，于是
转载
2024-09-30 22:59:25
68阅读
目录1.什么是Source Map2.1默认Source Map的问题 2.2解决默认Source Map的问题3. webpack生产环境下的Source Map3.1只定位行数不暴露源码 4. Source Map的最佳实践实际开发中需要自己配置webpack吗? 1.什么是Source MapSource Map就是一个信息文件，里面储存着位置信息。也就是说，S
1. 响应式系统 通过官网的介绍我们知道 Vue.js 是一个MVVM框架，它并不关心视图变化，而通过数据驱动视图更新，这让我们的状态管理非常简单，而这是怎么实现的呢。盗用官网一张图 每个组件实例都有相应的 Watcher 实例对象，它会在组件渲染的过程中把属性记录为依赖，之后…
原创
2021-09-08 16:52:57
206阅读
