Indicate entry html filename

demo/app.jsx

@@ -1,7 +1,8 @@
 import React from 'react';
 import Routing from '../src';
-import TV from './tv';
+import Trending from './trending';
 import Movie from './movie';
+import TV from './tv';
 import Purchased from './purchased';
 import Play from './play';
 import NotFound from './notfound';
@@ -22,29 +23,27 @@ class App extends React.Component {
     return (
       <div id="app">
         <div id="main">
-          <Movie          // test basic use
-            path="/movie"
-            title="Movies"
-            foo={11}
-            bar={22}
-          />
-          <TV             // test dynamic routing
-            path="/tv/"
-            title="TV Series"
-          />
+          {/* test html file */}
+          <Trending path="/" />
+
+          {/* test basic use */}
+          <Movie path="/movie" title="Movies" foo={11} bar={22} />
+
+          {/* test dynamic routing */}
+          <TV path="/tv/" title="TV Series" />
+
+          {/* test exclusive route */}
           <Routing>
-            <Purchased    // test exclusive route / test caching
-              path="/library/purchased"
-              autoCache
-            />
-            <Play         // test exclusive route / test url parameters
-              path="/library/:id"
-            />
+            {/* test caching */}
+            <Purchased path="/library/purchased" autoCache />
+            {/* test url parameters */}
+            <Play path="/library/:id" />
           </Routing>
-          <NotFound       // test not found
-            notFound
-          />
+
+          {/* test not found */}
+          <NotFound notFound />
         </div>
+
         <div id="sidebar">
           <button
             id="button-movie"

demo/index.jsx

@@ -2,14 +2,25 @@ import React from 'react';
 import { render } from 'react-dom';
 import App from './app';
 
-history.pushState({}, null, '/cinima');
+/*
+ * Mocking. This is not production code.
+ * Suppose your app has been deployed to www.domain.com/cinima
+ * And the entry html file is my-index.html
+ */
+history.pushState({}, null, '/cinima/my-index.html');
+/** 
+ * Mocking.
+*/
 
 const root = document.createElement('div');
 root.id = root;
 document.body.appendChild(root);
 
 render(
-  <App basename="/cinima" />,
+  <App
+    basename="/cinima"
+    htmlFile="my-index.html"
+  />,
   root
 );
 

demo/trending.jsx

@@ -0,0 +1,10 @@
+import React from 'react';
+import Routing from '../src';
+
+const Trending = () => (
+    <div id="trending">
+        Most popular videos here...
+    </div>
+);
+
+export default Routing(Trending);

package.json

@@ -1,6 +1,6 @@
 {
   "name": "less-router",
-  "version": "1.6.12",
+  "version": "1.6.14",
   "description": "A very easy React router component but full functionally.",
   "main": "src/index.jsx",
   "scripts": {

src/path/regex.js

@@ -1,3 +1,4 @@
+import proxy from '../proxy';
 import { cacheable } from '../helper';
 import { join } from './path';
 
@@ -16,8 +17,12 @@ const PARAMS_REPLACEMENT = '([\\w-~]+)';
  */
 const regexFromString = cacheable(
     string => {
-        if ('/' === string) {
-            string += '(?=(index.html)?$)';
+        if (
+            '/' === string &&
+            proxy.router &&
+            proxy.router.htmlFile
+        ) {
+            string += `(?=(${proxy.router.htmlFile})?$)`;
         } else if (string.endsWith('/')) {
             string = string.slice(0, string.length - 1);
             string += '(?=\\/?)';

src/router.jsx

@@ -25,9 +25,13 @@ class Router extends React.Component {
             : '';
     }
     get pathname() {
-        return this.state.pathname === '/index.html' ?
+        return this.state.pathname === this.htmlFile ?
             '/' : this.state.pathname;
     }
+    get htmlFile() {
+        return 'htmlFile' in this.props ?
+            this.props.htmlFile : '/index.html';
+    }
 
     push(pathname, cb) {
         return this.__change__('pushState', pathname, cb);

test/demo.test.js

@@ -13,6 +13,11 @@ const delay = time => new Promise(resolve =>
     setTimeout(resolve, time)
 );
 
+describe('homepage', () => {
+    expect(document.getElementById('trending'))
+        .toBeInstanceOf(HTMLElement);
+});
+
 describe('basic use', () => {
     beforeAll(() =>
         document
@@ -26,6 +31,8 @@ describe('basic use', () => {
     });
 
     test('route rendering', () => {
+        expect(document.getElementById('trending'))
+            .toBeFalsy();
         expect(document.getElementById('movie'))
             .toBeInstanceOf(HTMLElement);
         expect(document.getElementById('tv'))