{"id":18520001,"url":"https://github.com/ma63d/leetcode-viewer","last_synced_at":"2025-09-12T13:32:43.710Z","repository":{"id":143942953,"uuid":"75804956","full_name":"Ma63d/leetcode-viewer","owner":"Ma63d","description":"用无后台、纯前端的单页应用来分享、呈现你的leetcode源码吧!","archived":false,"fork":false,"pushed_at":"2017-07-27T16:00:05.000Z","size":3131,"stargazers_count":219,"open_issues_count":1,"forks_count":36,"subscribers_count":5,"default_branch":"master","last_synced_at":"2025-06-27T05:44:50.431Z","etag":null,"topics":["blog","github-page","leetcode","vue"],"latest_commit_sha":null,"homepage":"","language":"Vue","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Ma63d.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2016-12-07T06:06:21.000Z","updated_at":"2024-05-19T10:14:44.000Z","dependencies_parsed_at":null,"dependency_job_id":"a2eafc1a-0d88-478d-92bd-c3fa57600317","html_url":"https://github.com/Ma63d/leetcode-viewer","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/Ma63d/leetcode-viewer","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Ma63d%2Fleetcode-viewer","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Ma63d%2Fleetcode-viewer/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Ma63d%2Fleetcode-viewer/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Ma63d%2Fleetcode-viewer/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Ma63d","download_url":"https://codeload.github.com/Ma63d/leetcode-viewer/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Ma63d%2Fleetcode-viewer/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":274821698,"owners_count":25356345,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-09-12T02:00:09.324Z","response_time":60,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["blog","github-page","leetcode","vue"],"created_at":"2024-11-06T17:18:15.768Z","updated_at":"2025-09-12T13:32:43.698Z","avatar_url":"https://github.com/Ma63d.png","language":"Vue","funding_links":[],"categories":[],"sub_categories":[],"readme":"# leetcode-viewer\n\n\u003e 用无后台架构(backend-free)的Vue单页应用来分享、呈现你的leetcode解题源码吧!\n\n[线上Demo在此](https://ma63d.github.io/leetcode-viewer)\n\n\n\n只需要几行命令就可以立马搭建出一个完整的leetcode解题源码单页应用,完全无需后台,上传至github pages或你自己的服务器,即可一秒完整呈现你的leetcode源码.\n\n结合多说等评论插件,**一个带搜索功能、带评论、带自己的解题心得、带源码、带leetcode题目的leetcode博客就这样搭建起来了,而你,一行代码都不用写,只需要专注于解题和撰写解题博客。**\n\n![](./doc/pic1.png)\n![](./doc/pic2.png)\n\n技术上主要基于vue2.0全家桶.\n\n如果你在使用当中有什么疑问或者有什么需求、改进建议,都可以开issue,发pr.\n\n## 本项目需结合[leetcode-spider](https://github.com/Ma63d/leetcode-spider)使用\n\n[leetcode-spider](https://github.com/Ma63d/leetcode-spider)是我用JS写的leetcode解题源码爬虫, 自动将你的leetcode解题源码爬取下来,生成本地代码、题目文件.并生成本项目运行时所需的部分JSON文件.\n\n**所以使用前请先爬取你自己的leetcode源码**\n\n\n## usage 使用方法\n\n\n先clone/fork本项目 然后进入本项目所在文件夹\n\n```\ngit clone https://github.com/Ma63d/leetcode-viewer.git \ncd leetcode-viewer\n```\n\n安装npm依赖\n\n```\nnpm i\nnpm i leetcode-spider -g \n```\n然后按照lc-spider的使用方法 先爬下来你的leetcode解题源码 详见[leetcode-spider](https://github.com/Ma63d/leetcode-spider)使用介绍\n\n我推荐您在`leetcode-viewer/solutions`目录下存放源码,但只要保证是在`leetcode-viewer/`下都是可以的,如果您不是存放在`solutions`目录下,请参考后续章节[config](https://github.com/Ma63d/leetcode-viewer#config-配置),并修改其中的`sourcePath`\n\n```\n#进入您希望存放源码的目录,运行leetcode-spider,爬取源码\ncd solutions \nlc-spider\n```\n**再强调一遍!!!如果你不是在solutions目录下爬取的源码,那么请记得更改[config](https://github.com/Ma63d/leetcode-viewer#config-配置)中的sourcePath为你的源码目录**\n\n\n等leetcode-spider爬爬爬,爬好之后,打包生成应用\n\n``` \nnpm run build\n```\n\ngenerate源码相关信息\n**需要注意的是这行命令也是需要在你的源码存放目录下执行**\n\n\n```bash\nnpm run generate \n#用时一般不会超过0.5秒 \n```\n\nok了,现在,这就是一个可以放在任何一个静态服务器上的网页了.\n\n你可以把他push 到github pages,或者放到你自己的服务器上,呈现出来了.\n\n\n## writing posts 书写文章\n\n你可以为每一道leetcode题目编写您自己的解题心得(也就是博客文章),如下图所示:\n![](./doc/pic3.png)\n\n在题目的下方,会呈现你为该题编写的博客文章.\n\n编写方法就是,在您爬取的源码目录下的具体的某一道题的文件夹下 建立一个`post.md`文件,并用markdown语法在里面书写你的文章.\n\n**注意文件名只能是`post.md`,请勿改用其他名称**.\n\n假设您的爬取源码是放在leetcode-viewer/solutions/下,再假设您用java AC了第一题001.two-sum,那么此时目录结构如下:\n\n```\n├── solutions\n│   └───── 001.two-sum\n│\t\t\t\t└───── db.json // leetcode-viewer运行时所需的信息文件 \n│\t\t\t\t├───── question.md // leetcode-spider爬下来的这道leetcode的题目\n│\t\t\t\t├───── two-sum.java //leetcode-spider爬下来的你的解题源码\n│\t\t\t\t├───── post.md //你应该在此处创建该文件, 并在文件里用markdown语法书写你的文章\n```\n书写好新文章之后不需要任何指令,刷新页面就可以呈现出来!如果你是通过github pages或你自己的服务器上呈现的网页,上传到git或者你的服务器,就能生效.\n\n## config 配置\n\n**更新配置之后请重新执行`npm run build` 重新生成网页**\n\n在`leetcode-viewer/`目录下有一个js文件[build.conf.js](./build.conf.js),可以在里面更改配置\n配置项有如下几个\n\n- sourcePath\n\n  此路径填写为您存放目录leetcode源码文件的目录\n- author\n\n  此项填写为您的名字,这一项会用在封面页的介绍文字上\n  \n  显示为 `{{author}}'s Leetcode solutions`\n  \n  如果你不想显示你的名字,就填写`null`, \n  \n  介绍页面上会显示 `My Leetcode solutions`\n- gitRepo\n\n  如果你的leetcode源码已经存放在github上,那么此处可以填写为具体的项目地址\n  \n  这样,我会在导航栏添加一个链接到您的git项目地址\n  \n  否则,请保持`null`  \n- language \n\n  网页的语言,主要是封面介绍页和顶部导航条的文字,`zh` 中文 `en` 英文\n- duoShuoPlugin: false, \n\n  是否开启多数插件, 如果你开启此选项,请确保您已注册多说站点\n  \n  [多说](http://duoshuo.com/)是一个评论插件,可以为你的网站增加评论功能\n  \n- duoShuoShortName: 'your origin' \n\n  您的多说二级域名,如果您开启了多说,则一定要将此处的多说域名修改为您自己的多说域名\n  \n## updating 更新\n\n如果你在leetcode上又AC了一些题,并希望爬取下来,那你只需要再次进入到你的源码存放目录,然后执行命令`lc-spider`,就可以自动爬取下来你新解的题目.\n\n\u003e 我平常也是时不时解几道leetcode,所以我跟你的需求也是一样的,我也是有大量的增量爬取我最新写的代码的需求.因此我在编写[leetcode-spider](https://github.com/Ma63d/leetcode-spider)和leetcode-viewer时,为这种场景做了较多的优化.所以增量的爬取代码只需要再次进入到你的源码存放目录,然后执行命令`lc-spider`即可.如果你在以往AC的题目上提交了新的代码或者用其他编程语言再写了一遍,也可以爬,具体请查看[leetcode-spider](https://github.com/Ma63d/leetcode-spider).\n\n新的代码爬下来之后需要再次执行,\n\n```\nnpm run generate\n```\n\n[前面](https://github.com/Ma63d/leetcode-viewer#usage-使用方法)说过的哈,**这行命令是需要在你的源码存放目录下执行**\n\nok了,当前的网页呈现的是你的最新版代码.\n\n## 你还可以这么更新\n准备：\n* 首先新建你的题目托管分支`gh-pages`\n* 为目录下的`release.sh`赋予`777`权限\n* 在`solutions/`目录下创建`config.json`\n* `./release.sh`\n\n如果你使用github pages托管你的解题目录，你可以运行根目录下的`./release.sh`实现更新\n\n## other 其他\n\n如果你不熟悉Javascript, 可能会对`npm run build`和`npm run generate`这两条命令有点疑惑,\n\n- `npm run build`是用来打包生成前端网页的, 除了[使用方法](https://github.com/Ma63d/leetcode-viewer#usage-使用方法)里所说的进行leetcode-viewer的安装工作的时候用,就**只有**在你更新了[build.conf.js](./build.conf.js)时才需要再次执行该命令,其余时候都不用.\n\n- `npm run generate` 是用来生成网页运行的时候所需的一些JSON信息文件的,因此,如果你爬了新的代码,那么请记得爬好之后运行此命令,(而且再啰嗦一句,记得在leetcode源码目录运行此命令哈),而如果你是[写了新的博客文章](https://github.com/Ma63d/leetcode-viewer#writing-posts-书写文章),则不需要运行此命令,你要做的就是刷新网页.\n\n\n\n\n\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fma63d%2Fleetcode-viewer","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fma63d%2Fleetcode-viewer","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fma63d%2Fleetcode-viewer/lists"}