vue-cli腳手架的.babelrc文件

雖然es6還沒被瀏覽器全部支持，但是使用es6是大勢所趨，所以babel應運而生將es6代碼轉換成瀏覽器能夠識別的代碼

什么是.babelrc文件呢？ 熟悉linux的同學一定知道，rc結尾的文件通常代表運行時自動加載的文件，配置等等，類似bashrc,zshrc
這個文件是用來設置轉碼的規則和插件

vue-cli腳手架的.babelrc文件

{
    // 此項指明，轉碼的規則
    "presets": [
        // env項是借助插件babel-preset-env，下面這個配置說的是babel對es6,es7,es8進行轉碼，並且設置amd,commonjs這樣的模塊化文件，不進行轉碼
        ["env", {
         "modules": false ,
         "targets": {//需要支持的環境
           "browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
          }
        }],
        // 下面這個是不同階段出現的es語法，包含不同的轉碼插件
        // stage-x和es2015等有些類似，但是它是按照JavaScript的提案階段區分的，一共有5個階段。
        //而數字越小，階段越靠后，存在依賴關系。也就是說stage-0是包括stage-1的，以此類推。
        "stage-2"
    ],
    // 下面這個選項是引用插件來處理代碼的轉換，transform-runtime用來處理全局函數和優化babel編譯，強烈推薦使用transform-runtime
    "plugins": ["transform-runtime"],
    // 下面指的是在生成的文件中，不產生注釋
    "comments": false,
    // 下面這段是在特定的環境中所執行的轉碼規則，當環境變量是下面的test就會覆蓋上面的設置
    "env": {
        // test 是提前設置的環境變量，如果沒有設置BABEL_ENV則使用NODE_ENV，如果都沒有設置默認就是development
        "test": {
            "presets": ["env", "stage-2"],
            // instanbul是一個用來測試轉碼后代碼的工具
            "plugins": ["istanbul"]
        }
    }
}

---

browserslist: Library to share supported browsers list between different front-end tools. It is used in:

• Autoprefixer
• babel-preset-env
• eslint-plugin-compat
• stylelint-no-unsupported-browser-features
• postcss-normalize