問題背景

之前一個上線運行的 web 項目，客戶提了點新的需求。于是要修改部分原來的代碼。原來的代碼采用 ES5 書寫。本人現(xiàn)在階段早已轉(zhuǎn)入了 ES6 的陣營。更新代碼完畢后，還是采用 原有的 gulp 打包（我現(xiàn)在的項目中基本都用 webpack 了），竟然出現(xiàn)了如下錯誤：

Error at new JS_Parse_Error (eval at <anonymous>

控制條的報錯信息如下圖：

打包報錯信息

百思不得其解，原來運行好好的項目，我現(xiàn)在也沒做什么大的動作，怎么就跑步起來了呢？甚至連打包都失敗了？

原因分析

由于報錯信息并沒有指向我們自己編寫的文件，而都是指向了與 node.js相關的錯誤信息。于是應該可以判定：

代碼本身的書寫，包括語法等應該沒有問題，否則應該會指向代碼中具體錯誤。

由于經(jīng)驗有限，只得求助于百度、谷歌等。發(fā)現(xiàn)類似錯誤的解決方案中，中文參考資料實在是屈指可數(shù)。StackoverFlow 網(wǎng)站中倒是有不少大神提出與解惑相關的問題。無奈，囿于 English 水平實在有限，還是囫圇吞棗而不得其要。沒辦法，自己在苦思冥想罷。

打包失敗代碼追蹤

最終發(fā)現(xiàn)，多半是在 JavaScript 中書寫了 ES6 的代碼，然后也沒有采用 babel 等工具，把它轉(zhuǎn)化為 ES5 的寫法，就直接壓縮打包了。然后，就報這樣的錯誤了。

解決方案：很簡單，把 有關 ES6 的寫法全部都轉(zhuǎn)化為 ES5，再打包即可。就本次案例而言，把原來 console.log中的新型語法給注釋掉（或者編譯掉）即可打包成功。

打包成功

心得

修復錯誤容易，而定位到錯誤的根源卻著實不易。不過這正是學習的過程，這也是篤進的必然之路。

為什么看似如此簡單的一個錯誤卻很難被察覺？我想了想，與思維定式有著莫大的關系。熟悉了 ES6寫法后，似乎覺得這樣的寫法都是自然而然的事情，而很少再去深究細挖了。直到外在的某一事物，在某一時刻撞了一下自己，才恍然意識到，哦，原來我們也是很容易被自己的思維給框住的！