vscode 通過ftp發布vue到azure服務器

參考資料：vs code配置ftp連接遠程服務器實現代碼文自動上傳

1.在vscode應用商店中搜索拓展sftp插件，然后進行安裝。
2.安裝完成后重啟窗口，按快捷鍵Ctrl+shift+p，輸入sftp:config回車進入配置文件。

配置項：

{
    "host": "xxxx.ftp.azurewebsites.windows.net",  //ftp地址
    "protocol": "ftp",   //協議類型
    "port": 21,
    "username": "hsadmin\\qdhsadmin",   //用戶憑據中的用戶名
    "password": "P@ssw0rd",                   //用戶憑據中的密碼
    "remotePath": "/site/wwwroot",
    "uploadOnSave": true,
    "watcher": {
        "files": "**/dist",
        "autoUpload": true,
        "autoDelete": true
    }
}

在azure--應用程序服務---部署中心  設置ftp用戶憑據

設置ftp地址

azure

　　這樣發布到azure上有個問題

　　　　會把dist目錄也發布上去。

　　以前通過azure集成vscode的插件直接發布

　　　　發布后的目錄結構：wwwroot-->static

　　而我通過ftp

　　　　發布后的目錄結構：wwwroot-->dist-->static

　　　 這樣我通過域名訪問的時候，就無法訪問到應用程序。

　　解決方法

　　　　方法一

　　　　　　通過查找資料，發現vue cli有個屬性：publicPath,在項目根目錄下的vue.config.js文件中。

　　　　  默認值是:"/",通過文檔說明我們把它設置為空，就可以通過域名+“/dist/”的方式進行訪問你發布的項目了。

　　　　方法二

　　　　　　這個方法比較蠢笨

　　　　　　　　1.創建一個空白文件夾test，利用vscode打開這個文件夾test，

　　　　　　　　2.安裝sftp，配置好ftp路徑，然后把要發布的項目進行build，

　　　　　　　　3.把dist目錄下的文件都拷貝test文件夾，

　　　　　　　　4.在test項目中進行ftp部署，

　　　　　　　　5.在選中的文件夾鼠標右鍵-->upload,等待上傳成功即可。

以上是我能發現的方法，如果其他網友有更好的解決方案，歡迎留言。