1.下载源码

从git中找到vue源码,把repo链接复制,使用【 git clone 链接 】命令将vue源码下载到本地。

2.可以看到以下目录

每次看vue项目时,我们首先要看下package.json文件,我运行的是vue 2.6.10版本

3.先用【npm install】

先使用【npm install】命令将所需要的node包安装,npm的全称是node package manager

4.使用 【npm run dev】

再使用【npm run dev】的命令时,报了如下的错误

解决方法是找到 \node_modules\rollup-plugin-alias\dist\rollup-plugin-alias.js

 resolveId(importee, importer) {
const importeeId = normalizeId(importee);
const importerId = normalizeId(importer); // First match is supposed to be the correct one
const toReplace = aliasKeys.find(key => matches(key, importeeId)); if (!toReplace || !importerId) {
return null;
}
// const entry = options[toReplace];
const entry = normalizeId(options[toReplace]);//改成这句 let updatedId = normalizeId(importeeId.replace(toReplace, entry));

除了修改以上这行代码,还需要修改以下,添加--sourcemap, 用于生成.map文件

改完,保存后,再次【npm install dev】, 将在dist目录下生成vue.js和vue.js.map两个文件

如何运行Vue源码的更多相关文章

  1. 大白话Vue源码系列(05):运行时鸟瞰图

    阅读目录 Vue 实例的生命周期 实例创建 响应的数据绑定 挂载到 DOM 节点 结论 研究 runtime 一边 Vue 一边源码 初看 Vue 是 Vue 源码是源码 再看 Vue 不是 Vue ...

  2. 大白话Vue源码系列(01):万事开头难

    阅读目录 Vue 的源码目录结构 预备知识 先捡软的捏 Angular 是 Google 亲儿子,React 是 Facebook 小正太,那咱为啥偏偏选择了 Vue 下手,一句话,Vue 是咱见过的 ...

  3. 大白话Vue源码系列(02):编译器初探

    阅读目录 编译器代码藏在哪 Vue.prototype.$mount 构建 AST 的一般过程 Vue 构建的 AST 题接上文,上回书说到,Vue 的编译器模块相对独立且简单,那咱们就从这块入手,先 ...

  4. 大白话Vue源码系列(03):生成render函数

    阅读目录 优化 AST 生成 render 函数 小结 本来以为 Vue 的编译器模块比较好欺负,结果发现并没有那么简单.每一种语法指令都要考虑到,处理起来相当复杂.上篇已经生成了 AST,本篇依然对 ...

  5. 大白话Vue源码系列(04):生成render函数

    阅读目录 优化 AST 生成 render 函数 小结 本来以为 Vue 的编译器模块比较好欺负,结果发现并没有那么简单.每一种语法指令都要考虑到,处理起来相当复杂.上篇已经生成了 AST,本篇依然对 ...

  6. vue源码入口文件分析

    开发vue项目有段时间了, 之前用angularjs 后来用 reactjs 但是那时候一直没有时间把自己看源码的思考记录下来,现在我不想再浪费这 来之不易的思考, 我要坚持!! 看源码我个人感觉非常 ...

  7. 【vuejs深入二】vue源码解析之一,基础源码结构和htmlParse解析器

    写在前面 一个好的架构需要经过血与火的历练,一个好的工程师需要经过无数项目的摧残. vuejs是一个优秀的前端mvvm框架,它的易用性和渐进式的理念可以使每一个前端开发人员感到舒服,感到easy.它内 ...

  8. 深入vue - 源码目录及构建过程分析

     公众号原文链接:深入vue - 源码目录及构建过程分析   喜欢本文可以扫描下方二维码关注我的公众号 「前端小苑」 ​“ 本文主要梳理一下vue代码的目录,以及vue代码构建流程,旨在对vue源码整 ...

  9. Vue2.x源码学习笔记-Vue源码调试

    如果我们不用单文件组件开发,一般直接<script src="dist/vue.js">引入开发版vue.js这种情况下debug也是很方便的,只不过vue.js文件代 ...

随机推荐

  1. JavaScript 基础知识梳理——数据类型

    JavaScript的数据类型公有六种,ES6又新增了第七种Symbol类型的值. 数值(number) 字符串(string) 布尔值(boolean) undefined null 对象(obje ...

  2. FreeRTOS任务优先级说明

    https://www.cnblogs.com/yangguang-it/p/7156445.html#4217682 下面对 FreeRTOS 优先级相关的几个重要知识点进行下说明,这些知识点在以后 ...

  3. Gson/Jackson/FastJson工具类

    import java.util.ArrayList; import java.util.List; import java.util.Map; import com.google.gson.Gson ...

  4. JavaScript实现 简易 堆

    有两个原始操作用于保证插入或删除节点以后堆是一个有效的最大堆或者最小堆: shiftUp(): 如果一个节点比它的父节点大(最大堆)或者小(最小堆),那么需要将它同父节点交换位置.这样是这个节点在数组 ...

  5. Unable to copy file, Access to the path is denied

    Unable to copy file, Access to the path is denied http://stackoverflow.com/questions/7130136/unable- ...

  6. HDU 5852 Intersection is not allowed! ( 2016多校9、不相交路径的方案、LGV定理、行列式计算 )

    题目链接 题意 : 给定方格中第一行的各个起点.再给定最后一行与起点相对应的终点.问你从这些起点出发到各自的终点.不相交的路径有多少条.移动方向只能向下或向右 分析 : 首先对于多起点和多终点的不相交 ...

  7. 2019CSP-J第二轮 B题C题

    B.简单模拟 /* 寻找每一张公交票可用的最早的地铁优惠票,使用过之后一定要销毁*/ #include <iostream> #include <cstdio> #includ ...

  8. 图论小专题C

    3 负环及其应用 3.1 判定算法 判断负环只能用"边松弛"算法,也就是Bellman-Ford和SPFA算法.这两个算法都是\(O(NM)\)级别的.因为负环中一定存在一条负边, ...

  9. Eclise快捷键(最全)

    Eclipse常用快捷键 Eclipse常用快捷键 1几个最重要的快捷键 代码助手:Ctrl+Space(简体中文操作系统是Alt+/) 快速修正:Ctrl+1 单词补全:Alt+/ 打开外部Java ...

  10. 堡垒机前戏——paramiko

    提要:在写堡垒机之前,我们必须要了解paramiko这个第三方库.有关于python的第三方库的安装很简单,可以自行百度. 该模块基于SSH用于连接远程服务器并执行相关操作. SSHClient 用于 ...