如何獲得Jest運行測試對彙總+巴貝爾構建？

Question

我正在嘗試設置一個React模塊進行測試。我正在使用匯總來編譯一切，這很好。但我也試着介紹測試。

我的目錄結構：

dist/ 
    |- index.js 
src/ 
    |- .babelrc 
    |- util.js 
test/ 
    |- .babelrc 
    |- util.test.js 
rollup.config.js 

到目前爲止，一切都很好。我在這適用於我的源文件SRC有.babelrc：

{ 
    "presets": [ 
    ["es2015", { "modules": false }], 
    ["env", { "modules": false }], 
    "react" 
    ], 
    "plugins": ["external-helpers"] 
} 

和單獨一個的玩笑測試，沒有例外匯總要求：

{ 
    "presets": ["es2015", "env", "react"] 
} 

不幸的是，我得到我運行測試時出現錯誤，抱怨他們在源文件中運行的第一個es6功能（SyntaxError: Unexpected token export）。如果我刪除模塊異常，則測試通過，但彙總失敗。

如何讓babel將Rollup應用模塊例外，但不適用於Jest？還是有一種完全不同的方式我應該配置這些？

Answer 1

我已經解決了這個問題，但我不喜歡它，並且會喜歡更透明的解決方案。

我的test/.babelrc（沒有模塊例外）現在位於項目的根級別。

在我rollup.config.js，我已經設置rollup-plugin-babel忽略babelrc，並給予它是在我src/.babelrc選項：

babel({ 
    babelrc: false, 
    presets: [ 
    ['es2015', { modules: false }], 
    ['env', { modules: false }], 
    'react', 
    ], 
    plugins: ['external-helpers'], 
    exclude: 'node_modules/**', 
}), 

這似乎是工作，但在根級別ISN有.babelrc實際上用於編譯這個軟件包看起來像是後來混淆的祕訣。當然有更好的方法？

Answer 2

我最近有一個類似的問題（雖然我沒有使用React），並且在src /中生成了我的.babelrc文件，但卻產生了相同的錯誤。

我現在使用this configuration爲我的項目。自述文件包含一個解釋。

關鍵功能是我已經在 rollup.config.js中指定了babel config ，並且我包含選項babelrc: false。

我運行測試時不再出現錯誤，而且一切正常。這對你來說合理嗎？

import resolve from "rollup-plugin-node-resolve"; 
import babel from "rollup-plugin-babel"; 

export default { 
    input: "src/index.js", 
    output: [ 
    { 
     file: "build/index.cjs.js", 
     format: "cjs" 
    }, 
    { 
     file: "build/index.es.js", 
     format: "es" 
    } 
    ], 
    plugins: [ 
    resolve(), 
    babel({ 
     presets: [ 
     [ 
      "env", 
      { 
      modules: false 
      } 
     ] 
     ], 
     plugins: ["external-helpers"], 
     babelrc: false 
    }) 
    ] 
};