babel-preset-env

//tips:新手翻譯，歡迎指正

以兼容的形式把babel-preset-env嵌入到babel裏面

這將更容易的廢棄無用的代碼，並與剩下的代碼同步生產使用，原本呢，我不肯定它可以比我預料的時間更早的被生產使用，因此，它在一個單獨的分支下面，可是如今，這個分離使我很痛苦！

babel-preset-env

babel preset將基於你的實際瀏覽器及運行環境，自動的肯定babel插件及polyfills，轉譯ES2015及此版本以上的語言，

npm install babel-preset-env --save-dev

在沒有配置項的狀況下，babel-preset-env表現的同babel-preset-latest同樣(或者能夠說同babel-preset-es2015, babel-preset-es2016, and babel-preset-es2017結合到一塊兒，表現的一致)

{
    "presets": ["env"]
}

你也能夠經過配置polyfills和transforms來支持你所須要支持的瀏覽器，僅配置須要支持的語法來使你的打包文件更輕量級。

下面的例子，包括polyfills和代碼，針對各個瀏覽器的最新的兩個版本，以及safari的版本7及以上，針對以上兩個條件的兼容狀況進行代碼轉譯。咱們根據browserslist來分析具體的支持狀況，因此，你能夠用任何有效的browserslist查詢格式來配置選項。

{
  "presets": [
    ["env", {
      "targets": {
        "browsers": ["last 2 versions", "safari >= 7"]
      }
    }]
  ]
}

相同的，若是你的運行環境使node.js，你頁能夠配置babel-preset-env來支持一個特殊的node版本

{
  "presets": [
    ["env", {
      "targets": {
        "node": "6.10"
      }
    }]
  ]
}

爲了更佳的方便，可使用"node": "current"根據你運行時的node.js版本,挑選須要的polyfills和transforms來支持。

{
  "presets": [
    ["env", {
      "targets": {
        "node": "current"
      }
    }]
  ]
}

• 如何工做

• 安裝

• 用法

• 配置項

• 例子

• 問題

如何工做

肯定支持ECMAScript特定語法的環境

用外部數據例如：compat-table,來肯定瀏覽器的支持狀況。

咱們會按期的跑build-data.js來更新plugins.json

參考：問題7

維護一個map在javascript特定語法與bable插件之間

目前存儲在plugin-features.js
這樣應該是被大多數人的要求所期待的，有不少的例子說插件集應該被分開，或者某一個插件不夠足夠獨立(或不可能作到)。

babel支持全部的插件集的思想在babel-preset-latest被考慮進去

默認沒有配置的表現同babel-preset-latest同樣
不須要包含stage-x插件，env將提供全部的插件，支持到javascript最新的版本。

參考：問題14

肯定最低的插件公共標準被包含在preset裏

若是你target爲IE8和chrome55，它將會包含ie8所須要的全部插件，你未來可能仍然會須要支持

支持target配置"node": "current"來解析當前運行額度node版本

例如，若是你bulid在node6上面，箭頭函數沒有被轉換，若是運行在node0.12上面，將會被轉

支持browsers配置就像自動加上前綴同樣

利用browsers來聲明支持的環境，經過設置參數，例如>1%, last 2 versions

參考：問題19
瀏覽器支持列表
browsers列出來在不一樣的瀏覽器上前端語言的支持狀況，像工具好比autoprefixer style eslant-plugin-compat或者其餘更多的

默認狀況下，babel-preset-env會用browserlist config sources
例如，只須要對某個項目在兼容瀏覽器的最新兩個版本以及IE10，僅僅須要這個條件下餓polyfills和plugins

.babelrc

{
    "presets": [
        ["env", {
            "useBuiltIns": true
        }]
    ]
}

browserslist

last 2 versions
IE 10

或者

package.json

"browserslist": "last 2 versions, ie 10"

browserslist config在下面幾種狀況下將會被忽略

• 目標瀏覽器是特殊的(targets.browsers)

• 配置ignoreBrowserslistConfig: true 查看更多

目標合併

• 若是targets.browsers是正確的，browserslist config將會被忽略。在targets中配置的特殊瀏覽器將被合併到任何其餘明肯定義的目標瀏覽器上。若是合併，明肯定義的目標將覆蓋從其接收的相同目標targets.browsers。

• 若是目標瀏覽器不明確，程序將會帶着瀏覽器列表搜尋browserslist文件或package.json。嗖嗖將會從進程的工做目錄，或者配置文件的目錄開始查找，一直到系統跟目錄。若是同時找到一個browserslist文件和一個配置package.json，將拋出異常。

• 若是找到了一個browserslist配置，而且定義了其餘目標（但不是targets.browsers），則目標將按照與targets明肯定義的相同的方式合併targets.browsers。

安裝

npm

nom install --save-dev babel-preset-env

or yarn

yarn add babel-preset-env --dev

使用

沒有配置項將會運行全部轉換

{
    "presets": ["env"]
}

選項

有關設置preset的更多信息，請參閱preset插件配置文檔

targets

{[string]: number | string}, 默認爲{}
提供環境版本的對象來支持
每一個目標瀏覽器都須要一個數字或者一個字符串（咱們建議在指定次要版本時使用字符串 node: "6.10"）。
環境好比：chrome,opera,edge,firefox,safari,ie,ios,android,node,electron.
經過運行build-data腳本從compat-table獲取，產生以上數據。

targets.node

number | string | "current" | true
若是你想根據當前node版本編譯，能夠指定node: true或"node": "current",與"node":process.versions.node是同樣的。

targets.browsers

Array<string> | string
使用browserslist查詢使用瀏覽器(ex: last 2 versions, > 5%),瀏覽器的選擇結果將會被顯示的放到targets中。

spec

bool，默認爲false
啓用更多的規範兼容性，但會致使presets中的轉換變慢，以此來支持他們。

loose

bool，默認爲false
爲preset中的插件啓用鬆散轉換。

modules

"amd" | "umd" | "systemjs" | "commonjs" | false, defaults to "commonjs".
啓用es6模塊語法轉換爲另外一個模塊類型。
設爲false不會轉換。

debug

bool，默認爲false
輸出使用的目標/插件，並在指定的版本插件數據版本來console.log。

include

Array<string>, defaults to []
用於包含一組插件
有效的選項包含：

• babel 插件都包含，有前綴babel-plugin-transform-es2015-spread和無前綴transform-es2015-spread

• 內置插件，好比map set or Object.assign

若是當前的環境有問題，或者不支持或支持的很差的話，這個選項是頗有用的。
例如，node4支持classes但不支持其擴展功能，若是super與擴展參數一塊兒使用，那麼transform-classes是須要包含的，由於不能用super其餘的方式來擴展.
note: include和exclude選項只工做於包含在preset裏有的插件中。so，例如，包含proposal-do-expressions或者不包含proposal-function-bind將會報錯。要使用preset裏不包含的插件，請直接添加到您的配置中。

exclude

Array<string>,默認爲[]用於排除和一處一組插件有效的配置同include選項。這個配置對於黑名單的翻譯很是有用就像transform-regenerator，若是