Nuxt.js modern 屬性

2020-02-13 17:41 更新

modern 屬性

此功能的想法來自 vue-cli modern mode
  • 類型: String 或 Boolean默認: false可能的值:'client': 構(gòu)建兩個版本的包:同時提供面向支持現(xiàn)在瀏覽器的 ES2015+ 寫法支持 <script type ="module"> 和兼容性低的其他舊瀏覽器的包 <script nomodule> 的腳本,同時為現(xiàn)代瀏覽器打包提供 <link rel ="modulepreload"> 。每個正確解析模塊類型的現(xiàn)代瀏覽器都會加載現(xiàn)代瀏覽器軟件依賴包,而舊版瀏覽器則會加載到指定舊版瀏覽器的依賴包(已編譯)。'server' or true: Node.js服務(wù)器將根據(jù)用戶代理檢查瀏覽器版本,并提供相應(yīng)的現(xiàn)代瀏覽器或兼容性低的瀏覽器捆綁依賴。false: 關(guān)閉 modern 打包

捆綁打包的兩個版本是:

  1. Modern bundle: 定位支持ES模塊的現(xiàn)代瀏覽器
  2. Legacy bundle: 基于babel配置定位兼容性低瀏覽器(默認情況下兼容IE9)。

Info: 在package.json中,可以使用命令選項:[--modern | -m]=[mode] 來指定構(gòu)建并啟動(build/start) modern屬性,例如:

{
  "scripts": {
    "build:modern": "nuxt build --modern=server",
    "start:modern": "nuxt start --modern=server"
  }
}
  • 當(dāng)未指定modern時,在打包時Nuxt將自動檢測nuxt start中的modern,自動檢測模式為:
ModeModern Mode
universalserver
spaclient
  • 在使用nuxt generate時,modern mode只有client
  • 使用 build.crossorigin 在<link> 和 <script> 中設(shè)置 crossorigin 屬性
請參閱 Phillip Walton's excellent post 來了解更多關(guān)于modern builds信息.


以上內(nèi)容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號