前言
ES6 雖提供了許多新特性,但我們實際工作中用到頻率較高并不多,根據二八法則,我們應該用百分之八十的精力和時間,好好專研這百分之二十核心特性,将會收到事半功倍的奇效

一、開發環境配置
這部分着重介紹:babel 編譯 ES6 文法,如何用 webpack 實作子產品化。
1.babel
為啥需要 babel?
ES6 提供了許多新特性,但并不是所有的浏覽器都能夠完美支援。下圖是各個浏覽器對 ES6 相容性一覽表(以 export 為例)
image
export各個浏覽器相容性一覽表
由上圖可知,有些浏覽器對于 ES6 并不是很友好,針對 ES6 的相容性問題,很多團隊為此開發出了多種文法解析轉換工具(比如 babel,jsx,traceur 等),可以把我們寫的 ES6 文法轉換成 ES5,相當于在 ES6 和浏覽器之間做了一個翻譯官。其中Babel是一個廣泛使用的轉碼器,可以将 ES6 代碼轉為 ES5 代碼,進而在現有環境執行。
如何配置 babel?
·首先要先安裝node.js,運作npm init,然後會生成package.json檔案·npm install --save-dev babel-core babel-preset-es2015 babel-preset-latest·建立并配置.babelrc檔案//存放在項目的根目錄下,與node_modules同級·npm install -g babel-cli·babel-version
Babel 的配置檔案是.babelrc,存放在項目的根目錄下。該檔案用來設定轉碼規則和插件,具體内容如下:
//.babelrc檔案{ "presets": ["es2015