web-dev-qa-db-ja.com

テスト時にJestに.lessインポートを無視させる

コンポーネントのテスト

Jestを使用してreactコンポーネントでいくつかの非常に簡単なテストを実行しようとしています。コンポーネントファイルの先頭にあるこの行が原因で問題が発生しています

import {} from './style.less';

ここでのインポートはテストする必要がなく、理想的にはテストから無視されます。

[npmテスト]の結果

npm testを介してテストを実行すると、応答が返されます

FAILtests/ app_test.js●ランタイムエラーSyntaxError：予期しないトークン{ファイル 'client/components/app /style.less'。

プリプロセッサが正しく設定されていることを確認し、「preprocessorIgnorePatterns」構成が正しいことを確認してください。 http://facebook.github.io/jest/docs/api.html#preprocessorignorepatterns-array-string 現在Jestをセットアップしているか、プリプロセッサを変更している場合は、jest --no-cacheを試してください。プリプロセッサ：node_modules/jest-css-modules。 Jestは、次の前処理されたコードを実行しようとしました。//いくつかの.lessコード

しかし、インポート行が少ないことをコメントアウトすると、テストは正しく実行されます。

質問

Jestにこのコード行をスキップさせたり、このインポートを無視させたりするにはどうすればよいですか？

node.jsunit-testingreactjsjestjs
14
Joe Lloyd

それでもこの問題が発生する場合は、次の構成を_jest.config.json_ファイルに追加してみてください。

"transform": { "^.+\\.(css|less)$": "./styleMock.js" }

ここで、_styleMock.js_で、_.less_ファイルを次のように変換する transformer を作成しています。

module.exports = { process() { return '' } }

10
Art713

テストの上部にある.lessファイルを手動でモックする以外の方法で、jestが無視するファイルを少なくする唯一の方法は、次のとおりです。

jest.mock("../../src/styles.less", () => jest.fn());

Package.jsonに以下を追加することでした：

"jest": {
 "moduleNameMapper": {
  ".*\\.less$": "<rootDir>/pathToDummyFile/dummy.js"
  }
 },

コードがより少ないファイルをインポートしようとすると、代わりにインポートをリダイレクトして空のダミーファイルをフェッチします。これにより、予期しないトークンエラーが発生しなくなります。

6
Andrew

パーティーには少し遅れますが、多分これは今日の誰かを助けるでしょう。 jest-transform-stub を使用します。

Jest構成で、jest-transform-stubを追加して、スタブするJavaScript以外のアセットを変換します。

{
  "jest": {
    // ..
    "transform": {
      "^.+\\.js$": "babel-jest",
      ".+\\.(css|styl|less|sass|scss|png|jpg|ttf|woff|woff2)$": "jest-transform-stub"
    }
  }
}

FAQ

モジュールが変換されていません

Jestは、デフォルトではnode_modulesに変換を適用しません。 moduleNameMapperを使用してこれを解決できます。

{
  "jest": {
    // ..
    "moduleNameMapper": {
      "^.+.(css|styl|less|sass|scss|png|jpg|ttf|woff|woff2)$": "jest-transform-stub"
    }
  }
}
3
Chris Camaratta

私はignore-styles（ https://github.com/bkonkle/ignore-styles ）で同じ問題を解決しました。私はこのlibをモカで使用しましたが、冗談で大丈夫だと思います。

1
Zapix