這段時間,學習了一點關於es6新規範的知識,而後心血來潮,想嘗試一下用ES6編寫的代碼在瀏覽器中跑起來。html
說幹就幹,先說下個人實現步驟(沒想到有坑!)node
而後下面是個人一些目錄結構,大體預覽一下。webpack
src,es6開發目錄es6
dist,es5生產目錄web
test,一個測試目錄瀏覽器
而後,看一下個人ES6開發的一些js是什麼樣子。app
file file2 app 異步
test 工具
而後咱們在html中引入dist中的通過轉譯的文件學習
在瀏覽器中測試,test中由於沒引入模塊,因此正常執行,app中由於引入了模塊,並且是CommonJS規範,可是瀏覽器不支持這種規範,所以報錯
假如,咱們爲了測驗,就給html加上requireJS文件,瀏覽器支持AMD/CMD規範。異步加載定義。
可是,咱們發現,仍是會報錯,說明語法不支持,或者二者衝突了,由於一種是AMD,一種是CommonJS。
因爲咱們經過node來編譯ES6成ES5,node模塊就是參照CommonJS規範來的,因此ES5的語法,也屬於CommonJS規範,並且如今的瀏覽器和node都不支持ES6的規範或大部分不支持。
解決方法
通過查閱資料,發現能夠經過webpack打包工具來將依賴合併成一個文件,而後引入html中。