1. 程式人生 > >vue的部署上線

vue的部署上線

    專案本地開發完成後,我們就需要將程式碼 部署到線上伺服器。再次之前,就需要把這些零散的檔案打包成一個css和js檔案,以減少http的請求數,避免額外的效能損耗。

    vue-cli提供了程式碼編譯、合併、壓縮的指令碼build/build.js,執行npm run build後,得到檔案如下所示

build.js將元件中的css變異合併成一個app.[hash].css檔案。

js則在合併後又拆分成了3個檔案,app.[hash].js包含了所有components中的js程式碼,vendor.[hash].js包含了所有引用的node_modules中的程式碼,而mainfest.[hash].js則包含了webpack執行環境,以及模組化 所需的js程式碼。

這樣拆分的好處是,每塊元件修改重新編譯後,不影響其他未修改的js檔案的hash值,這樣能夠最大限度的使用快取,減少htttp請求。