如何运行Vue源码
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源码的更多相关文章
- 大白话Vue源码系列(05):运行时鸟瞰图
阅读目录 Vue 实例的生命周期 实例创建 响应的数据绑定 挂载到 DOM 节点 结论 研究 runtime 一边 Vue 一边源码 初看 Vue 是 Vue 源码是源码 再看 Vue 不是 Vue ...
- 大白话Vue源码系列(01):万事开头难
阅读目录 Vue 的源码目录结构 预备知识 先捡软的捏 Angular 是 Google 亲儿子,React 是 Facebook 小正太,那咱为啥偏偏选择了 Vue 下手,一句话,Vue 是咱见过的 ...
- 大白话Vue源码系列(02):编译器初探
阅读目录 编译器代码藏在哪 Vue.prototype.$mount 构建 AST 的一般过程 Vue 构建的 AST 题接上文,上回书说到,Vue 的编译器模块相对独立且简单,那咱们就从这块入手,先 ...
- 大白话Vue源码系列(03):生成render函数
阅读目录 优化 AST 生成 render 函数 小结 本来以为 Vue 的编译器模块比较好欺负,结果发现并没有那么简单.每一种语法指令都要考虑到,处理起来相当复杂.上篇已经生成了 AST,本篇依然对 ...
- 大白话Vue源码系列(04):生成render函数
阅读目录 优化 AST 生成 render 函数 小结 本来以为 Vue 的编译器模块比较好欺负,结果发现并没有那么简单.每一种语法指令都要考虑到,处理起来相当复杂.上篇已经生成了 AST,本篇依然对 ...
- vue源码入口文件分析
开发vue项目有段时间了, 之前用angularjs 后来用 reactjs 但是那时候一直没有时间把自己看源码的思考记录下来,现在我不想再浪费这 来之不易的思考, 我要坚持!! 看源码我个人感觉非常 ...
- 【vuejs深入二】vue源码解析之一,基础源码结构和htmlParse解析器
写在前面 一个好的架构需要经过血与火的历练,一个好的工程师需要经过无数项目的摧残. vuejs是一个优秀的前端mvvm框架,它的易用性和渐进式的理念可以使每一个前端开发人员感到舒服,感到easy.它内 ...
- 深入vue - 源码目录及构建过程分析
公众号原文链接:深入vue - 源码目录及构建过程分析 喜欢本文可以扫描下方二维码关注我的公众号 「前端小苑」 “ 本文主要梳理一下vue代码的目录,以及vue代码构建流程,旨在对vue源码整 ...
- Vue2.x源码学习笔记-Vue源码调试
如果我们不用单文件组件开发,一般直接<script src="dist/vue.js">引入开发版vue.js这种情况下debug也是很方便的,只不过vue.js文件代 ...
随机推荐
- 利用collections下的counter实现对列表重复元素的查重
mylist = [0,1,1,2,2,3,3,3,3,4,5,6,7,7,8,8,9,10,10,11,22,33,22] from collections import Counter c = C ...
- Linux查找文件内容小技巧
目录 grep ag linux系统查找文件内容最常见的命令有grep和ag grep grep是比较常见的查找命令 # 在当前目录的py文件里查找所有相关内容 grep -a "broad ...
- RecursiveTask和RecursiveAction的使用 以及java 8 并行流和顺序流(转)
什么是Fork/Join框架 Fork/Join框架是Java7提供了的一个用于并行执行任务的框架, 是一个把大任务分割成若干个小任务,最终汇总每个小任务结果后得到大任务结果的框架. 我 ...
- 01 salt平台,软件架构图
1.前期调研 1.别人家的 https://www.cnblogs.com/ssyfj/p/9060367.html#top https://www.cnblogs.com/evilliu/artic ...
- HDU 6088 - Rikka with Rock-paper-scissors | 2017 Multi-University Training Contest 5
思路和任意模数FFT模板都来自 这里 看了一晚上那篇<再探快速傅里叶变换>还是懵得不行,可能水平还没到- - 只能先存个模板了,这题单模数NTT跑了5.9s,没敢写三模数NTT,可能姿势太 ...
- EasyLogging++学习笔记(1)—— 简要介绍
对于有开发经验的程序员来说,记录程序执行日志是一件必不可少的事情.通过查看和分析日志信息,不仅可以有效地帮助我们调试程序,而且当程序正式发布运行之后,更是可以帮助我们快速.准确地定位问题.在现在这个开 ...
- css(name|pro|[,val|fn])
css(name|pro|[,val|fn]) 概述 访问匹配元素的样式属性.大理石平台支架 jQuery 1.8中,当你使用CSS属性在css()或animate()中,我们将根据浏览器自动加上前缀 ...
- PHP mysqli_fetch_fields() 函数
mysqli_fetch_fields() 函数返回结果集中代表字段(列)的对象的数组. 返回结果集中代表字段(列)的对象的数组,然后输出每个字段名称.表格和最大长度: <?php // 假定数 ...
- Could not load file or assembly "\win32_x86\dotnet1\crdb_adoplus.dll' or one of its dependencies.
Could not load file or assembly 'file:///C:\Program Files (x86)\SAP BusinessObjects\Crystal Repor ...
- learning docker steps(9) ----- arm linux docker 安装
参考:https://docs.docker.com/install/linux/docker-ce/ubuntu/#install-docker-ce-1 想要在arm linux上安装docker ...