Vue 源码分析——构造函数原型

时间:2022-09-28 13:47:03

在执行 npm run dev 的时候 根据script/config.js 文件中的配置

'web-full-dev': {

  entry: resolve('web/entry-runtime-with-compiler.js'),

  dest: resolve('dist/vue.js'),

  format: 'umd',

  env: 'development',

  alias: { he: './entity-decoder' },

  banner  }

可知入口文件为 'web/entry-runtime-with-compiler.js',最终输出为'dist/vue.js',

  有一个umd 模块,模块的类型总共有(iife amd cmd cjs umd es6)

在script 文件下的 alias.js 是别名配置文件。

  module.exports = {

      vue: resolve('src/platforms/web/entry-runtime-with-compiler'),

      compiler: resolve('src/compiler'),  core: resolve('src/core'),

       shared: resolve('src/shared'),  web: resolve('src/platforms/web'),

      weex: resolve('src/platforms/weex'),

      server: resolve('src/server'),

      entries: resolve('src/entries'),

      sfc: resolve('src/sfc') }

例如:web: resolve('src/platforms/web')  web 指向 'src/platforms/web' 路径

  打开  src/platforms/web/entry-runtime-with-compiler.js

  会发现  import Vue from './runtime/index'  这个文件的 Vue  是从

  './runtime/index' 导入来的,接下来打开 runtime 目录下的 index.js

Vue 源码分析——构造函数原型的更多相关文章

  1. vue 快速入门 系列 —— 侦测数据的变化 - [vue 源码分析]

    其他章节请看: vue 快速入门 系列 侦测数据的变化 - [vue 源码分析] 本文将 vue 中与数据侦测相关的源码摘了出来,配合上文(侦测数据的变化 - [基本实现]) 一起来分析一下 vue ...

  2. Vue源码分析(二) : Vue实例挂载

    Vue源码分析(二) : Vue实例挂载 author: @TiffanysBear 实例挂载主要是 $mount 方法的实现,在 src/platforms/web/entry-runtime-wi ...

  3. Vue源码分析(一) : new Vue() 做了什么

    Vue源码分析(一) : new Vue() 做了什么 author: @TiffanysBear 在了解new Vue做了什么之前,我们先对Vue源码做一些基础的了解,如果你已经对基础的源码目录设计 ...

  4. 前端Vue 源码分析-逻辑层

    Vue 源码分析-逻辑层 预期的效果: 监听input的输入,input在输入的时候,会触发 watch与computed函数,并且会更新原始的input的数值.所以直接跟input相关的处理就有3处 ...

  5. [Vue源码分析] v-model实现原理

    最近小组有个关于vue源码分析的分享会,提前准备一下… 前言:我们都知道使用v-model可以实现数据的双向绑定,及实现数据的变化驱动dom的更新,dom的更新影响数据的变化.那么v-model是怎么 ...

  6. 【Spring源码分析】原型Bean实例化过程、byName与byType及FactoryBean获取Bean源码实现

    原型Bean加载过程 之前的文章,分析了非懒加载的单例Bean整个加载过程,除了非懒加载的单例Bean之外,Spring中还有一种Bean就是原型(Prototype)的Bean,看一下定义方式: & ...

  7. vue源码分析—Vue.js 源码目录设计

    Vue.js 的源码都在 src 目录下,其目录结构如下 src ├── compiler # 编译相关 ├── core # 核心代码 ├── platforms # 不同平台的支持 ├── ser ...

  8. vue源码分析—认识	Flow

    认识 Flow Flow 是 facebook 出品的 JavaScript 静态类型检查⼯具.Vue.js 的源码利⽤了 Flow 做了静态类型检查, 所以了解 Flow 有助于我们阅读源码 Flo ...

  9. Vue 源码分析—— 目录结构

    一,Vue.js 的源码都是在src 目录下,其目录结构如下. 1.compiler 目录包含Vue.js 所有编译相关的代码.它包括把所有模板解析成ast 语法树, ast 语法树优化等功能. 2. ...

随机推荐

  1. 从零开始系列--R语言基础学习笔记之一 环境搭建

    R是免费开源的软件,具有强大的数据处理和绘图等功能.下面是R开发环境的搭建过程. 一.点击网址 https://www.r-project.org/ ,进入"The R Project fo ...

  2. testing - 测试基本使用接口

    testing - 测试基本使用接口 当你写完一个函数,结构体,main之后,你下一步需要的就是测试了.testing包提供了很简单易用的测试包. 写一个基本的测试用例 测试文件的文件名需要以_tes ...

  3. zlog学习笔记(zc_profile)

    zc_profile.h #ifndef __zlog_profile_h #define __zlog_profile_h #define EMPTY() #define zc_assert(exp ...

  4. 问:Linux下Chrome标题栏中文乱码

    From:http://blog.csdn.net/loveaborn/article/details/29579787 在使用Linux的时候你会遇到一些奇奇怪怪的问题,不过,你会在解决这些问题的过 ...

  5. flask页面中Head标签内容为空问题

    在使用flask时遇到点问题,以前还没有注意到. 生成页面的时候使用的是模板继承方式,当添加meta标题的时候,本来是添加的base.html模板中的head标签中,但是生成页面后,head中的内容却 ...

  6. poj1363Rails(栈模拟)

    主题链接: id=1363">啊哈哈,点我点我 思路: 这道题就是一道简单的栈模拟. .. .我最開始认为难处理是当出栈后top指针变化了. .当不满足条件时入栈的当前位置怎么办.这时 ...

  7. bootstrap css选择不同的宽度

    刚开始使用bootstrap css开源项目.遇到一个问题,默认的input 宽度太大,需要找小一点的. 其实只需要在input tag中选用预定义的较小的宽度即可.比如: <input typ ...

  8. ASP&period;NET请求处理过程

    当请求一个*.aspx文件的时候,这个请求会被inetinfo.exe进程截获,它判断文件的后缀(aspx)之后,将这个请求转交给Aspnet_isapi.dll,aspnet_isapi.dll会通 ...

  9. Android中用友盟实现QQ的第三方登录

    //首先应该去友盟的官网注册你的账号,创建一个应用,获得它的APPkey,也可以用它的API上的appkey,下载SDK,下面根据API文档一步步实现就行了. //下面是友盟的APi文档 1.  产品 ...

  10. 添加本地jar包到maven仓库

    mvn install:install-file -Dfile=D:\video-lib\log4j-.jar -DgroupId=video -DartifactId=log4j -Dversion ...