{"id":15019547,"url":"https://github.com/whelmin/navify","last_synced_at":"2025-10-24T12:31:20.246Z","repository":{"id":57308997,"uuid":"66460313","full_name":"whelmin/navify","owner":"whelmin","description":"🌏 An elegant website navigation page generator - 网址导航页生成器","archived":false,"fork":false,"pushed_at":"2019-09-14T07:07:37.000Z","size":152,"stargazers_count":23,"open_issues_count":0,"forks_count":4,"subscribers_count":4,"default_branch":"master","last_synced_at":"2025-01-31T01:23:50.051Z","etag":null,"topics":["cli","navify","navigation-generator","vuejs"],"latest_commit_sha":null,"homepage":"https://whelmin.github.io/navify-example","language":"Vue","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/whelmin.png","metadata":{"files":{"readme":"README-zh.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2016-08-24T12:00:18.000Z","updated_at":"2023-03-23T02:35:36.000Z","dependencies_parsed_at":"2022-08-29T08:02:11.267Z","dependency_job_id":null,"html_url":"https://github.com/whelmin/navify","commit_stats":null,"previous_names":[],"tags_count":1,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/whelmin%2Fnavify","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/whelmin%2Fnavify/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/whelmin%2Fnavify/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/whelmin%2Fnavify/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/whelmin","download_url":"https://codeload.github.com/whelmin/navify/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":237964659,"owners_count":19394438,"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","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":["cli","navify","navigation-generator","vuejs"],"created_at":"2024-09-24T19:53:40.587Z","updated_at":"2025-10-24T12:31:19.873Z","avatar_url":"https://github.com/whelmin.png","language":"Vue","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Navify\n\n[![npm version](https://img.shields.io/npm/v/navify.svg?style=flat-square)](https://www.npmjs.com/package/navify)\n[![npm total downloads](https://img.shields.io/npm/dt/navify.svg?style=flat-square)](https://www.npmjs.com/package/navify)\n[![License](https://img.shields.io/github/license/whelmin/navify.svg?style=flat-square)](https://github.com/whelmin/navify/blob/master/LICENSE)\n\n🌏 一个叫 `Navify` 的网址导航生成器。\n\n## 如何使用\n\n### 1. **全局安装**\n\n```bash\n$ npm install -g navify\n```\n\n### 2. **用法**\n\n**2.1、创建并自动初始化项目**\n\n```bash\n$ navify create \u003cdir\u003e\n```\n\n在 `\u003cdir\u003e` 目录下，会自动生成可进行配置的 `index.html` 和 `nav.json` 文件。\n\n**2.2、实时预览**\n\n```bash\n$ cd \u003cdir\u003e\n$ navify serve\n```\n\n修改配置和数据时，项目会实时在本地 Web `8520` 端口中呈现。\n\n**2.3、`index.html` 配置项**\n\n```html\n\u003cscript\u003e\n  window.Navify = {\n    el: '#app',\n    json: './nav.json',\n    title: {\n      alias: '前端',\n      full: 'Web前端导航',\n      en: 'Front End',\n    },\n    author: {\n      name: 'Cong Min',\n      link: 'https://congm.in',\n    },\n    github: 'https://github.com/whelmin/navify',\n    icon: {\n      'share': 'https://.../share.png',\n    },\n    favicon: 'https://www.google.cn/s2/favicons?domain=',\n    // favicon: 'https://api.byi.pw/favicon/?url=' 国内备选\n  };\n\u003c/script\u003e\n```\n\n| 名称 | 类型 | 说明 | 默认值 |\n|:---:|:----------:|:---------|:----|\n| **el** | `String` | **挂载元素** | `'#app'` |\n| **json** | `String` | **json文件来源**。本地相对路径或者网络链接 | `'./nav.json'` |\n| **title** | `String/Object` | **站点名称**。若值为对象：可设 **`full`(全称)** / **`alias`(简称)** / **`en`(英文名)** 3个属性；若值为字符串：则解析为站点全称 `title.full` | `'Navify'` |\n| **author** | `String/Object` | **站点作者信息**。若值为对象：可设 **`name`(名字)** / **`link`(个人主页)** 2个属性；若值为字符串：则解析为作者名字 `author.name` | `null` |\n| **github** | `String` | **Github链接**。设置后页面右上角会出现Github标志 | `null` |\n| **icon** | `Object` | **站点链接自定义图标**。一个Key-Value键值对象：`key` 是对应的icon名称(即nav.json内item.link的key)，`value` 是icon地址(可填写本地相对路径或者网络链接)，默认 home/github 已经拥有了内置的icon。无对应icon时将以 key 作为文本链接。 | `{}` |\n| **favicon** | `String` | **favicon网站图标地址**。设置获取favicon的API服务商地址，国内可考虑备选: `'https://api.byi.pw/favicon/?url='` | `'https://www.google.cn/s2/favicons?domain='` |\n\n**2.4、`nav.json` 数据格式**\n\n关于 `nav.json` 的数据结构，你应该遵守以下规则格式进行网站的增删改操作。\n\n```js\n// nav.json\n// List - 分类列表\n[\n  {\n    \"heading\": \"类别名(必需)\",\n    \"info\": \"类别简介(可无)\",\n    \"content\": [\n      ...\n    ]\n  },\n  {\n    ...\n  }\n]\n```\n\n```js\n// List[n].content\n// Group - 类别分组列表\n[\n  {\n    \"title\": \"分组名(可无)\",\n    \"info\": \"分组简介(可无)\",\n    \"item\": [\n      ...\n    ]\n  }\n]\n```\n\n```js\n// Group[m].item\n// Item - 网站列表\n[\n  {\n    \"name\": \"网站名(必需)\",\n    \"info\": \"网站简介(可无)\",\n    \"link\": {\n      \"home\": \"网站主页地址(必需)\",\n      \"github\": \"网站Github地址(可无)\"\n    }\n  }\n]\n```\n\n较完整的例子：\n\n```json\n[\n  {\n    \"heading\": \"类别名A\",\n    \"content\": [\n      {\n        \"item\": [\n          {\n            \"name\": \"网站名1\",\n            \"info\": \"网站名1的简介\",\n            \"link\": {\n              \"home\": \"网站名1的主页地址\",\n              \"github\": \"网站名1的Github地址\"\n            }\n          }\n        ]\n      }\n    ]\n  },\n  {\n    \"title\": \"分组名a\",\n    \"item\": [\n      {\n        \"name\": \"网站名2\",\n        \"link\": {\n          \"home\": \"网站名2的主页地址\"\n        }\n      }\n    ]\n  }\n]\n```\n\n### 3. **部署访问**\n\n**方式一、部署在服务器上**\n\n将你的 `\u003cdir\u003e` 目录部署至自己的Web静态服务器，即可直接访问。\n\n**方式二、Github Page**\n\nGitHub Pages 支持从以下代码源读取html文件\n\n* `docs/` 目录\n* `master` 或 `gh-pages` 分支\n\n将代码提交到github，在对应的github仓库 **设置选项** 开启 `GitHub Pages` 功能，选择 `master branch` 选项并保存，即可访问。还可以绑定自定义的域名。\n\n![GitHub Pages 部署截图](https://user-images.githubusercontent.com/13345272/46583007-727aa680-ca82-11e8-8548-ec6defbfb04b.png)\n---\n\n## 关于\n\n### 联系作者\n\n[@ whelmin](https://whelm.in) \u0026 [@ Cong Min](https://congm.in)\n\n### 开源许可证\n\n[MIT License](https://github.com/whelmin/navify/blob/master/LICENSE)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwhelmin%2Fnavify","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fwhelmin%2Fnavify","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwhelmin%2Fnavify/lists"}