大神寫得不錯，如果像在本地打開的話把webpack生成環(huán)境配置中的publicPath 改成相對路徑就好了 比如原來是/dist/改成./dist/

執(zhí)行打包命令之后生成了一個新的dist文件夾和一個index_prod.html文件，把這兩個提取出來，然后把index_prod.html重命名為index.html;開啟服務(wù)后就可以通過配置的路由訪問了！

直接這樣不能運行的吧，因為是前端路由，需要有靜態(tài)服務(wù)器，類似NGINX這種

謝邀！
由于vue-router路由的緣故，需要有web代理服務(wù)器，開發(fā)環(huán)境一般采用express、webpack-dev-server等，生產(chǎn)環(huán)境一般放到nginx或者apache、tomcat等web代理服務(wù)器中，同時要根據(jù)自己服務(wù)器的項目路徑更改vue的路由地址。開發(fā)環(huán)境用什么就查相關(guān)的配置，我就簡單說一下生產(chǎn)環(huán)境下單頁面如何部署：

如果說項目是直接跟在域名后面的，比如:http://www.sosout.com ，根路由就是 '/'。
如果說項目是直接跟在域名后面的一個子目錄中的，比如:http://www.sosout.com/children ，根路由就是 '/children '，不能直接訪問index.html。

以配置Nginx為例，配置過程大致如下：
（假設(shè)：
1、項目文件目錄： /mnt/html/iview（iview目錄下的文件就是執(zhí)行了npm run dist 后生成的iview目錄下的文件）
2、訪問域名：iview.sosout.com）
進入nginx.conf新增如下配置：

server {
    listen 80;
    server_name  iview.sosout.com;
    root /mnt/html/iview;
    index index.html;
    location ~ ^/favicon\.ico$ {
        root /mnt/html/iview;
    }

    location / {
        try_files $uri $uri/ /index.html;
        proxy_set_header   Host             $host;
        proxy_set_header   X-Real-IP        $remote_addr;
        proxy_set_header   X-Forwarded-For  $proxy_add_x_forwarded_for;
        proxy_set_header   X-Forwarded-Proto  $scheme;
    }
    access_log  /mnt/logs/nginx/access.log  main;
}

注意事項：
1、配置域名的話，需要80端口，成功后，只要訪問域名即可訪問的項目
2、如果你使用了vue-router的 history 模式，在nginx配置還需要重寫路由：

server {
    listen 80;
    server_name  iview.sosout.com;
    root /mnt/html/iview;
    index index.html;
    location ~ ^/favicon\.ico$ {
        root /mnt/html/iview;
    }

    location / {
        try_files $uri $uri/ @fallback;
        index index.html;
        proxy_set_header   Host             $host;
        proxy_set_header   X-Real-IP        $remote_addr;
        proxy_set_header   X-Forwarded-For  $proxy_add_x_forwarded_for;
        proxy_set_header   X-Forwarded-Proto  $scheme;
    }
    location @fallback {
        rewrite ^.*$ /index.html break;
    }
    access_log  /mnt/logs/nginx/access.log  main;
}

為什么要重寫路由？因為我們的項目只有一個根入口，當(dāng)輸入類似/home的url時，如果找不到對應(yīng)的頁面，nginx會嘗試加載index.html，這是通過vue-router就能正確的匹配我們輸入的/home路由，從而顯示正確的home頁面，如果history模式的項目沒有配置上述內(nèi)容，會出現(xiàn)404的情況。

base: string
應(yīng)用的基路徑。例如，如果整個單頁應(yīng)用服務(wù)在 /app/ 下，然后 base 就應(yīng)該設(shè)為 "/app/"。

默認(rèn)的太坑了,把main.js里的mode: 'history',這個去掉就能本地運行