title: Vue direct URL is not working, only router-link click
body: <p>This may be a known Vue routing thing that I am totally missing.</p>
  
  <p>So I have a .vue file that uses the url /hardware. 
  Here is the routing</p>
  
  <pre><code>{
      path: "/hardware",
      name: "Hardware",
      component: () =&gt;
        import(/* webpackChunkName: "hardware" */ "../views/Hardware.vue")
    },
  </code></pre>
  
  <p>Going to /hardware directly using a link on an external site or typing it in the address bar does not work, gives me Page Not Found.
  But clicking on this link in my nav bar does work.</p>
  
  <pre><code>&lt;router-link to="/hardware"&gt;Hardware&lt;/router-link&gt;
  </code></pre>
  
  <p>Am I missing something super obvious that I missed when I was learning routing? Is this because it is a single page application? Thanks in advance for any help.</p>
  
  <p>Adding that I do have history mode on, wondering if this is the issue?</p>
  
  <pre><code>const router = new VueRouter({
    mode: "history",
    base: process.env.BASE_URL,
    routes
  });
  </code></pre>