Vuejsプロジェクトのノードバージョン:v10.6.0
Package.jsonバージョン:
"devDependencies": {
"@vue/cli-plugin-babel": "^3.0.0-rc.4",
"@vue/cli-plugin-unit-jest": "^3.0.0-rc.4",
"@vue/cli-service": "^3.0.0-rc.4",
"@vue/test-utils": "^1.0.0-beta.20",
"babel-core": "7.0.0-bridge.0",
"babel-jest": "^23.0.1",
"vue-template-compiler": "^2.5.16"
},
ビルドインタスクで実行すると、
"test:unit": "vue-cli-service test:unit"
しかし、デバッグしたいので、nodeコマンドを使用して手動で実行します。
node node_modules/.bin/jest
次のエラーが表示されます。
FAIL tests/unit/HelloWorld1.spec.js
● Test suite failed to run
.../tests/unit/HelloWorld1.spec.js:1
({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){import "core-js/modules/es6.array.iterator";
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
SyntaxError: Unexpected string
at ScriptTransformer._transformAndBuildScript (node_modules/jest-runtime/build/script_transformer.js:403:17)
次のコンテンツで.babelrcを追加した後
{"env": {
"development": {
"plugins": ["transform-es2015-modules-commonjs"]
},
"test": {
"plugins": ["transform-es2015-modules-commonjs"]
}
}}
物事は少し良くなりました。「インポート」なしでテストファイルを渡すことができます。インポートが完了すると、別のエラーが表示されます。
....tests/unit/HelloWorld1.spec.js:3
import _interopRequireWildcard from "..../node_modules/@babel/runtime/helpers/builtin/es6/interopRequireWildcard";
^^^^^^^^^^^^^^^^^^^^^^^
SyntaxError: Unexpected identifier
at ScriptTransformer._transformAndBuildScript (node_modules/jest-runtime/build/script_transformer.js:403:17)
数日間苦労した後。最後に、VueJsアプリケーションのデバッグモードでjestを実行するソリューションを得ました。
Vue-cli-serviceと@vue/cli-plugin-unit-jest
にデバッグした後、jestプロセスを生成する前に次のコードを見つけました。
process.env.VUE_CLI_BABEL_TARGET_NODE = true
process.env.VUE_CLI_BABEL_TRANSPILE_MODULES = true
したがって、解決策は非常に簡単です。
Jestコマンドを実行する前に、これら2つの環境変数を追加するだけです。次のコマンドは、デバッグモードでjestを開始します。
export VUE_CLI_BABEL_TARGET_NODE=true
export VUE_CLI_BABEL_TRANSPILE_MODULES=true
./node_modules/jest/bin/jest.js --clearCache
node --inspect-brk ./node_modules/jest/bin/jest.js -i
DO N'Tを追加してください。「。babel.rc」を追加すると、VueJS babelが大きくなります。
そして、多くの場合、--clearCache
オプションを指定してjestを実行する必要があります。そうしないと、生成された古いファイルも混乱します。
Jestオプション-i
も重要です。それ以外の場合、テストはデバッグモードではない別のプロセスで実行されます。
同じ問題がありました。
FAIL tests/unit/example.spec.js
● Test suite failed to run
.../tests/unit/example.spec.js:1
({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){import "core-js/modules/es6.array.find";
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
SyntaxError: Unexpected string
at ScriptTransformer._transformAndBuildScript (node_modules/jest-runtime/build/script_transformer.js:403:17)
上記の答えを試してみました。 この記事 私の問題を解決しました。
解決策:
{
"version": "0.2.0",
"configurations": [
{
"name": "vscode-jest-tests",
"type": "node",
"request": "launch",
"runtimeArgs": [
"--inspect-brk",
"./node_modules/@vue/cli-service/bin/vue-cli-service.js",
"test:unit",
"--runInBand"
],
"cwd": "${workspaceFolder}",
"protocol": "inspector",
"disableOptimisticBPs": true,
"console": "integratedTerminal",
"internalConsoleOptions": "neverOpen",
"outFiles": [ "${workspaceFolder}/src/**/*.js"],
"port": 9229
},
]
}
別の解決策は、Node Environmentが正しく解決されていることを確認することです。
私の場合、「開発」に解決されます。 package.json
を次のように更新すると、問題が解決しました。
"test": "NODE_ENV=test jest"
これにより、babel configがテスト構成を使用するようになります。