vue項目使用history模式打包應該注意的地方


1.在config/index.js中將assetsPublicPath原來的’/‘修改為‘./’。

build: {
env: require('./prod.env'),
index: path.resolve(__dirname, '../dist/index.html'),
assetsRoot: path.resolve(__dirname, '../dist'),
assetsSubDirectory: 'statics',
assetsPublicPath: '/',

2.在nigx服務器上的操作

  1.

 

server
{
##在server下添加或在location里面添加以下代碼
location /
{
if (!-e $request_filename) {
rewrite ^(.*)$ /index.html?s=$1 last;
break;
}
}
## 如果訪問的不是根目錄用下面方式設置 qiancheng是我的子目錄
   location /qiancheng{
    if (!-e $request_filename) {
      rewrite ^/(.*) /qiancheng/index.html last;
      break;
    }
  }
}

配置后刷新頁面出現404的話前端改一下打包文件把相對路徑改成絕對路徑就OK了!

// 這是原來的代碼
<link href=./static/css/app.917e9845e61fd94284baf966597e6264.css rel=stylesheet>
// 這是修改后的代碼
<link href=/static/css/app.917e9845e61fd94284baf966597e6264.css rel=stylesheet>
// 如果訪問的是子目錄請加上子目錄
<link href=/子目錄/static/css/app.917e9845e61fd94284baf966597e6264.css rel=stylesheet>

 2.

把項目打包后的dist里面的文件復制粘貼到Nginx的html文件下(替換Nginx的文件)


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM