原來一直以為vue@cli3 就是創建模板的工具,讀了官方文檔才知道原來這么有用,不少配置讓我長見識了
Prefetch 懶加載配置
懶加載相信大家都是知道的,使用Import() 語法就可以在需要的時候加載了,但是讀了官方文檔Prefetch一節后,發現事情並沒有想象的那么簡單。
文檔寫的很清楚,Prefetch是在空閑的時候就加載一些不着急的文件,並且import默認是加上了Prefetch的,也就是說你使用了import可能並不是你想要的結果(比如用戶點擊某個按鈕才觸發加載,不然永遠不加載,這樣可以節省流量),
為了驗證寫了個小用例測試了下,最后看network發現真的是就算你懶加載了,但是等程序空閑了並且父級區塊加載了,他還是會提前加載你可能需要的文件。
怎么關閉呢,文檔也說的很清楚
打包現代模式
之前看性能優化的文章有提到過,因為babel轉義會使代碼執行變慢,但是為了兼容又需要轉義,解決辦法是生成2套代碼,現代瀏覽器使用不轉義的代碼,老瀏覽器使用轉義的代碼,使用type="module"來區分是哪種瀏覽器,現在vue-cli3已經給你做好配置了,你只需要加一個參數就能使用了,真爽~
文檔地址: https://cli.vuejs.org/zh/guide/browser-compatibility.html#現代模式