如何查询Vue单文件组件的源码路径？

本文共计1391个文字，预计阅读时间需要6分钟。

这个问题需要从一个创意角度说起。D2Admin 是一个开源的前端中后台集成方案，最初是基于 vue-cli2 开发的。作者李想希望在页面右下角添加一个 Toggle 点击按钮，可以直接跳转到当前页面的源代码。

这个问题要从一个想法说起。

D2Admin 是一个开源的，前端中后台集成方案，原先是基于 vue-cli2，大概是向 vue-cli3 过渡时，
作者老李，想在页面右下角加个 Toggle 点击，跳到当前页面源码对应的 github 页面。

确实很实用的功能，D2Admin 的 Demo 页面太多了，想看某个页面的源码，对于不熟悉项目目录结构的新手很不友好。
这些页面统一为 .vue 组件，那么转换一下：如何获取 vue 单文件自身源码路径？

目前经历了三个方案，最终目标是把自身路径赋值到 this.$options.__source 上。目前方案 3 是最新的。