create-react-app-typescript
create-react-app-typescript copied to clipboard
Jest doesn't resolve absolute paths from tsconfig
When running quick test:
import * as React from 'react';
import { shallow } from 'enzyme';
import App from '../App';
it('renders without crashing', () => {
shallow(<App />);
});
I got error in Jest: 'Cannot find module '@store' from 'App.tsx'
My tsconfig:
{
"compilerOptions": {
"paths": {
"@store": ["./store"],
"@store/*": ["store/*"],
"@scenes/*": ["scenes/*"],
"@scenes": ["scenes"],
"@components/*": ["components/*"],
"@components": ["components"],
"@utils": ["utils"],
"@utils/*": ["utils/*"],
"@api": ["./api"],
"@constants/*": ["constants/*"],
"@constants": ["constants"],
"@assets/*": ["assets/*"],
"@containers/*": ["containers/*"],
"@containers": ["containers"],
"@theme": ["theme"],
"@types": ["types"]
},
"baseUrl": "./src",
"outDir": "build/dist",
"module": "esnext",
"target": "es5",
"lib": ["es6", "es7", "dom"],
"sourceMap": true,
"allowJs": true,
"jsx": "react",
"moduleResolution": "node",
"rootDir": "./",
"forceConsistentCasingInFileNames": true,
"noImplicitReturns": true,
"noImplicitThis": true,
"noImplicitAny": false,
"importHelpers": true,
"strictNullChecks": true,
"suppressImplicitAnyIndexErrors": true,
"allowSyntheticDefaultImports": true,
"noUnusedLocals": true,
"noUnusedParameters": true
},
"exclude": [
"node_modules",
"build",
"scripts",
"acceptance-tests",
"webpack",
"jest",
"src/setupTests.ts"
// "src/modules"
]
}
App is running successfully. But jest can't resolve absolute paths from tsconfig. What should i do to fix this?
I think this is what you want: https://jest-bot.github.io/jest/docs/configuration.html#modulenamemapper-object-string-string
I have it set up like this to allow import blah from 'src/utils/blah'
:
moduleNameMapper: {
'^src/(.*)$': '<rootDir>/src/$1'
}