Webpack無法編譯ES6檔案的原因分析

2021-09-19 01:10:50 字數 1122 閱讀 1772

首先給大家分享乙個巨牛巨牛的人工智慧教程,是我無意中發現的。教程不僅零基礎,通俗易懂,而且非常風趣幽默,還時不時有內涵段子,像看**一樣,哈哈~我正在學習中,覺得太牛了,所以分享給大家!點這裡可以跳轉到教程

在專案中使用了webpack與es6技術,但經常出現es6檔案沒有編譯的錯誤,如下:

main.js:62 uncaught syntaxerror: unexpected token export
瀏覽器提示export關鍵無法識別,顯然es檔案沒有被編譯,依次診斷的順序如下:

如果沒有在babel-loader裡明確指定es6的子集,那麼系統根路徑下必須包含.babelrc檔案,其內容如下所示:

需要注意的是,務必保證相關的包都安裝完成,如babel-preset-stage-2、babel-plugin-transform-runtime。

在babel-loader的配置中,include的配置路徑必須是絕對路徑,如下:

確認es6檔案的字尾名與babel-loader的配置是否匹配,假如是以上的寫法,es6檔案的字尾名必須是es6,否則將不會編譯。

瀏覽人工智慧教程

在專案中使用了webpack與es6技術,但經常出現es6檔案沒有編譯的錯誤,如下:

main.js:62 uncaught syntaxerror: unexpected token export
瀏覽器提示export關鍵無法識別,顯然es檔案沒有被編譯,依次診斷的順序如下:

如果沒有在babel-loader裡明確指定es6的子集,那麼系統根路徑下必須包含.babelrc檔案,其內容如下所示:

需要注意的是,務必保證相關的包都安裝完成,如babel-preset-stage-2、babel-plugin-transform-runtime。

在babel-loader的配置中,include的配置路徑必須是絕對路徑,如下:

確認es6檔案的字尾名與babel-loader的配置是否匹配,假如是以上的寫法,es6檔案的字尾名必須是es6,否則將不會編譯。

webpack安裝(構建ES6的編譯環境)

1.在此之前先安裝git,安裝node.js 先全域性安裝 npm install webpack g npm install webpack dev server g 2.新建乙個檔案 例如 es6 webpack 然後滑鼠右鍵進入git bach here 輸入 git clone 如果電腦已經...

重構之路 webpack配置es6語法

之前已經寫好了最簡單的乙個webpack配置,並且已經可以執行js了,但是,新時代的前端肯定要寫es6啊,但是我們在index.js裡寫上es6的語法時,比如 使用es6裡的set和擴充套件運算子來實現陣列去重 varset new set 1 2,2 3,3 4,4 5,5 console.log...

使用webpack配置es6開發環境

全域性安裝webpack npm install g webpack 安裝依賴 babel core babel loader babel preset es2015 html webpack plugin webpack webpack dev server 其中babel core babel ...