vue使用vue-router時，路徑中會有#的欄位，是應為打包完成之後，專案為單頁面專案，所有的url都指向單個頁面，#號之後的路徑是指該頁面的錨定位置，所以router中的路徑是無法載入的。

若想去除#，就需要使用router的history模式， 且在伺服器端進行配置

import Vue from 'vue'

import Router from 'vue-router'

Vue.use(Router)

const router = new Router({

  mode: 'history',（使用history模式）

  routes: [

    {

      path: '/',

      name: '****',

      component: ****

    }

  ]

})

export default router

後端配置例子

Apache

<IfModule mod_rewrite.c>

  RewriteEngine On

  RewriteBase /

  RewriteRule ^index\.html$ - [L]

  RewriteCond %{REQUEST_FILENAME} !-f

  RewriteCond %{REQUEST_FILENAME} !-d

  RewriteRule . /index.html [L]

</IfModule>

nginx

location/{

        try_files $uri $uri/ /index.html;

}

原生 Node.js

const http = require('http')

const fs = require('fs')

const httpPort = 80

http.createServer((req,res)=>{

    fs.readFile('index.htm','utf-8',(err,content)=>{

        if(err){

            console.log('We cannot open "index.htm" file.')

        }

        res.writeHead(200,{

            'Content-Type':'text/html; charset=utf-8'

        })

        res.end(content)

    })

}).listen(httpPort,()=>{

    console.log('Server listening on: http://localhost:%s',httpPort)

})