ddo · dpotapov · May 27, 2019 · May 27, 2019 · May 27, 2019 · May 27, 2019
diff --git a/README.md b/README.md
@@ -11,7 +11,6 @@ go get -u github.com/ddo/go-vue-handler
 
 * build vue app to get ``index.html`` and ``dist`` folder
 * serve it as a static folder with go server
-* all the static files must has extension
 
 ## example
 
@@ -46,4 +45,24 @@ func main() {
 	err := server.ListenAndServe()
 	panic(err)
 }
-```
+```
+
+## caveat
+
+> Your server will no longer report 404 errors as all not-found paths now serve up your `index.html`
+> file. To get around the issue, you should implement a catch-all route within your Vue app to show
+> a 404 page:
+>
+> ```js
+> const router = new VueRouter({
+>   mode: 'history',
+>   routes: [
+>     { path: '*', component: NotFoundComponent }
+>   ]
+> })
+> ```
+>
+
+https://router.vuejs.org/guide/essentials/history-mode.html#caveat
+
+In addition, `go-vue-handler` tries to analyze HTTP Accept header, so if the browser expects to see an HTML5 page (mime type is `text/html`) it will receive `index.html` contents, otherwise - 404 status code.
diff --git a/test/public/index.html b/test/public/index.html
@@ -1 +1,21 @@
-<!DOCTYPE html><html><head><meta charset=utf-8><meta name=viewport content="width=device-width,initial-scale=1"><title>test</title><link href=/static/css/app.8a2065fc6ff38e2d0ec0c0e3509637eb.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=/static/js/manifest.2ae2e69a05c33dfc65f8.js></script><script type=text/javascript src=/static/js/vendor.7fed9fa7b7ba482410b7.js></script><script type=text/javascript src=/static/js/app.bef432c284d1df839809.js></script></body></html>
+<!DOCTYPE html>
+<html>
+<head>
+  <title>go-vue-handler</title>
+  <script src="https://unpkg.com/vue"></script>
+  <script src="https://unpkg.com/vue-router"></script>
+</head>
+<body>
+    <div id="app">
+        <h1>Hello App!</h1>
+        <p>
+          <router-link to="/foo">Go to Foo</router-link>
+          <router-link to="/bar">Go to Bar</router-link>
+          <router-link to="/foo.bar">Go to Foo.Bar</router-link>
+          <router-link to="/bad/route">Go to Bad Route</router-link>
+        </p>
+        <router-view></router-view>
+    </div>
+    <script src="/js/app.js"></script>
+</body>
+</html>
diff --git a/test/public/js/app.js b/test/public/js/app.js
@@ -0,0 +1,22 @@
+const Foo = { template: '<div>foo</div>' }
+const Bar = { template: '<div>bar</div>' }
+const FooBar = { template: '<div>foo.bar</div>' }
+const PageNotFound = { template: '<h2>404 - Page Not Found</h2>' }
+const routes = [
+    { path: '/foo', component: Foo },
+    { path: '/bar', component: Bar },
+    { path: '/foo.bar', component: FooBar },
+    { path: '*', component: PageNotFound },
+]
+const router = new VueRouter({
+    mode: 'history',
+    routes: routes
+})
+
+var app = new Vue({
+    el: '#app',
+    router: router,
+    data: {
+        message: 'Hello Vue!'
+    }
+})
diff --git a/test/public/static/css/app.8a2065fc6ff38e2d0ec0c0e3509637eb.css b/test/public/static/css/app.8a2065fc6ff38e2d0ec0c0e3509637eb.css
diff --git a/test/public/static/css/app.8a2065fc6ff38e2d0ec0c0e3509637eb.css.map b/test/public/static/css/app.8a2065fc6ff38e2d0ec0c0e3509637eb.css.map
diff --git a/test/public/static/js/app.bef432c284d1df839809.js b/test/public/static/js/app.bef432c284d1df839809.js
diff --git a/test/public/static/js/app.bef432c284d1df839809.js.map b/test/public/static/js/app.bef432c284d1df839809.js.map
diff --git a/test/public/static/js/manifest.2ae2e69a05c33dfc65f8.js b/test/public/static/js/manifest.2ae2e69a05c33dfc65f8.js