Vue新手教程 2 將vue專案發布到生產環境

2021-09-11 23:11:51 字數 628 閱讀 1600

1.編譯vue專案

操作命令:npm run build

編譯成功後會自動生成dist目錄 (包括了static子目錄以及index.html檔案)

2.安裝web伺服器tomcat

3.將編譯後的檔案放到tomcat伺服器

部署完成,啟動 tomcat,瀏覽器中輸入http://localhost:8080/dist

訪問時遇到的問題:

若瀏覽器出現空白,可能是靜態資源路徑問題,通過以下方式可以解決:

開啟vue專案的config/index.js檔案,找到build節點下面的assetspublicpath引數

將絕對路徑 '/' 改為相對路徑 './'(斜槓前面加個點),重新使用npm run build命令進行編譯並複製到tomcat目錄下替換舊檔案

vue新手教程

看到沒,可以node回車之後,可以像chrome的console面板一樣去執行命令。2 安裝 映象 node安裝完畢,自帶npm npm是隨同nodejs一起安裝的包管理工具,能解決nodejs 部署上的很多問題 但是,你身處 要載入國外的包,那是要慢成狗,所以這裡推薦安裝 映象 安裝完後npm 都...

新手建立VUE專案

安裝你的node包,一直next,然後就提示安裝好了。接下來,看看有沒有安裝成功。cmd代開小黑窗,輸入node v,回車!顯示得有node版本號,然後接著輸入npm v,回車!也能顯示npm的版本,ok,成功了。但是,有的小夥伴也可能會遇到npm v後有小游標在閃,這時找到這個路徑c users ...

vue構建專案教程步驟詳解

按照提示進行安裝操作,直至完成。開啟命令程式輸入 如上圖則為安裝成功。使用 npm映象 npm install g cnpm registry 安裝vue cli 全域性安裝 vue cli cnpm install vue cli g檢查vue cli是否安裝成功 vue list構建vue專案 ...