Create-react-app: Testing with Jest and Webpack aliases

Created on 30 Mar 2017  Â·  5Comments  Â·  Source: facebook/create-react-app

when I use create-react-app
my webpack aliases is

image

and my jest config is
qq20170330-230943 2x

import module like this
image

when I use npm run start , I can run my project correctly.
But, when I use npm run test, it throw an error I can not find the module which i import in the last picture .
How can I solve this ?

question

Most helpful comment

I suspect it's because you have a $ (match end) in your Jest moduleNameMapper config, as ^kr$ does not match kr/utils.

You probably need a second case like ^kr[/](.+) which maps to <rootDir>/src/$1.

(your mileage may vary, this is an educated guess)

All 5 comments

I suspect it's because you have a $ (match end) in your Jest moduleNameMapper config, as ^kr$ does not match kr/utils.

You probably need a second case like ^kr[/](.+) which maps to <rootDir>/src/$1.

(your mileage may vary, this is an educated guess)

I want kr match ./src, and 'schoolBackend' match ./src/application/backend/school.
How can I set my jest config ?
when I run npm run test , I can find my webpack alias.

Webpack does not use regex like Jest, you must make the changes explained above.

Can jest-webpack-alias, Jest/Webpack docs work in my problem ?
I read the Jest/Webpack docs, but it did not work.Am I in the wrong direction ?

I'm going to close this since it isn't very actionable by us.
Basically, webpack knows a lot more about modules than Jest and knows how to remap all usages of kr for you.
Jest relies on custom built regex by you, which requires you to match your slash-includes separately.

You can see https://github.com/facebook/jest/pull/1723 for more details.

Please try the changes mentioned above.
If that doesn't work, you might find success using jest-webpack-alias, but we cannot provide you with support whilst using that.
It seems to me like you're relying on additional tooling unnecessarily -- perhaps you ejected too early without looking at alternatives to solve your problems.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

Evan-GK picture Evan-GK  Â·  3Comments

JimmyLv picture JimmyLv  Â·  3Comments

xgqfrms-GitHub picture xgqfrms-GitHub  Â·  3Comments

rdamian3 picture rdamian3  Â·  3Comments

dualcnhq picture dualcnhq  Â·  3Comments