| FazBrowse GitHub Viewer | Trending | | Home |
| Tools: [Download Repo ZIP] [Original HTTPS Page] |
| Original file line number | Diff line number | Diff line change | |
|---|---|---|---|
@@ -44,11 +44,16 @@ window.$docsify = { | |||
| 44 | 44 | '/zh-cn/changelog': '/changelog', | |
| 45 | 45 | '/changelog': | |
| 46 | 46 | 'https://raw.githubusercontent.com/docsifyjs/docsify/master/CHANGELOG', | |
| 47 | + | ||
| 48 | + // You may need this if you use routerMode:'history'. | ||
| 47 | 49 | '/.*/_sidebar.md': '/_sidebar.md', // See #301 | |
| 48 | 50 | }, | |
| 49 | 51 | }; | |
| 50 | 52 | ``` | |
| 51 | 53 | ||
| 54 | + > **Note** If you change [`routerMode`](#routermode) to `'history'`, you may | ||
| 55 | + > want to configure an alias for your `_sidebar.md` and `_navbar.md` files. | ||
| 56 | + | ||
| 52 | 57 | ## auto2top | |
| 53 | 58 | ||
| 54 | 59 | - Type: `Boolean` | |
@@ -659,6 +664,8 @@ window.$docsify = { | |||
| 659 | 664 | ||
| 660 | 665 | ## routerMode | |
| 661 | 666 | ||
| 667 | + Configure the URL format that the paths of your site will use. | ||
| 668 | + | ||
| 662 | 669 | - Type: `String` | |
| 663 | 670 | - Default: `'hash'` | |
| 664 | 671 | ||
@@ -668,6 +675,57 @@ window.$docsify = { | |||
| 668 | 675 | }; | |
| 669 | 676 | ``` | |
| 670 | 677 | ||
| 678 | + For statically-deployed sites (f.e. on GitHub Pages) hash-based routing is | ||
| 679 | + simpler to set up. For websites that can re-write URLs, the history-based format | ||
| 680 | + is better (especially for search-engine optimization, hash-based routing is not | ||
| 681 | + so search-engine friendly) | ||
| 682 | + | ||
| 683 | + Hash-based routing means all URL paths will be prefixed with `/#/` in the | ||
| 684 | + address bar. This is a trick that allows the site to load `/index.html`, then it | ||
| 685 | + uses the path that follows the `#` to determine what markdown files to load. For | ||
| 686 | + example, a complete hash-based URL may look like this: | ||
| 687 | + `https://example.com/#/path/to/page`. The browser will actually load | ||
| 688 | + `https://example.com` (assuming your static server serves | ||
| 689 | + `index.html` by default, as most do), and then the Docsify JavaScript code will | ||
| 690 | + look at the `/#/...` and determine the markdown file to load and render. | ||
| 691 | + Additionally, when clicking on a link, the Docsify router will change the | ||
| 692 | + content after the hash dynamically. The value of `location.pathname` will still be | ||
| 693 | + `/` no matter what. The parts of a hash path are _not_ sent to the server when | ||
| 694 | + visiting such a URL in a browser. | ||
| 695 | + | ||
| 696 | + On the other hand, history-based routing means the Docsify JavaScript will use | ||
| 697 | + the [History API](https://developer.mozilla.org/en-US/docs/Web/API/History_API) | ||
| 698 | + to dynamically change the URL without using a `#`. This means that all URLs will | ||
| 699 | + be considered "real" by search engines, and the full path will be sent to the | ||
| 700 | + server when visiting the URL in your browser. For example, a URL may look like | ||
| 701 | + `https://example.com/path/to/page`. The browser will try to load that full URL | ||
| 702 | + directly from the server, not just `https://example.com`. The upside of this is | ||
| 703 | + that these types of URLs are much more friendly for search engines, and can be | ||
| 704 | + indexed (yay!). The downside, however, is that your server, or the place where | ||
| 705 | + you host your site files, has to be able to handle these URLs. Various static | ||
| 706 | + website hosting services allow "rewrite rules" to be configured, such that a | ||
| 707 | + server can be configured to always send back `/index.html` no matter what path | ||
| 708 | + is visited. The value of `location.pathname` will show `/path/to/page`, because | ||
| 709 | + it was actually sent to the server. | ||
| 710 | + | ||
| 711 | + TLDR: start with `hash` routing (the default). If you feel adventurous, learn | ||
| 712 | + how to configure a server, then switch to `history` mode for better experience | ||
| 713 | + without the `#` in the URL and SEO optimization. | ||
| 714 | + | ||
| 715 | + > **Note** If you use `routerMode: 'history'`, you may want to add an | ||
| 716 | + > [`alias`](#alias) to make your `_sidebar.md` and `_navbar.md` files always be | ||
| 717 | + > loaded no matter which path is being visited. | ||
| 718 | + > | ||
| 719 | + > ```js | ||
| 720 | + > window.$docsify = { | ||
| 721 | + > routerMode: 'history', | ||
| 722 | + > alias: { | ||
| 723 | + > '/.*/_sidebar.md': '/_sidebar.md', | ||
| 724 | + > '/.*/_navbar.md': '/_navbar.md', | ||
| 725 | + > }, | ||
| 726 | + > }; | ||
| 727 | + > ``` | ||
| 728 | + | ||
| 671 | 729 | ## routes | |
| 672 | 730 | ||
| 673 | 731 | - Type: `Object` | |
| Back | FazBrowse Home | New Git URL |
0 commit comments