Nuxt.js modern 屬性

modern 屬性

此功能的想法來自 vue-cli modern mode

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

捆綁打包的兩個(gè)版本是:

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

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

{
  "scripts": {
    "build:modern": "nuxt build --modern=server",
    "start:modern": "nuxt start --modern=server"
  }
}

• 當(dāng)未指定modern時(shí)，在打包時(shí)Nuxt將自動(dòng)檢測(cè)nuxt start中的modern，自動(dòng)檢測(cè)模式為：

• 在使用nuxt generate時(shí)，modern mode只有client
• 使用 build.crossorigin 在<link> 和 <script> 中設(shè)置 crossorigin 屬性

請(qǐng)參閱 Phillip Walton's excellent post 來了解更多關(guān)于modern builds信息.