I use Jest with Typescript. I want to create a monorepo. My folders structure is:
fe
|-app1
|--.jest.config.ts
|--tsconfig.json
|-shared
|--dummyData.ts
I want a unit test from app1
to access some data from shared
folder.
fe/app1/demo.spec.ts
:
import { someData } from '@shared/dummyData' //<--HERE: the alias is works, but jest can not understand "export" keyword
descrube('demo' () => {
it('demo test', () => {
expect(someData).toBe('DUMMY'));
})
})
fe/shared/dummyData.ts
:
export const someData = 'DUMMY';
The problem is that jest throws an error:
Jest encountered an unexpected token
{"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){export const someData = 'DUMMY';
^^^^^^
As I understand it cannot parse typescript or es6 modules that were produced by ts and babel.
The thing that it works fine while shared
folder is inside app1
, but once it's outside (and outside the root folder, i.g '<rootDir>/../shared/$1'
) it start throwing that error.
Here is my configs:
I described alias in fe/app1/tsconfig.json
:
{
...
"pilerOptions": {
"target": "esnext",
"module": "esnext",
"paths": {
"@/*": ["app/src/*"],
"@shared/*": ["shared/*"]
}
}
}
And in fe/app1/.jest.config.ts
:
module.exports = {
...
transform: {
'^.+\\.js$': '<rootDir>/node_modules/babel-jest',
'^.+\\.(jsx?|tsx?)$': 'ts-jest'
},
moduleNameMapper: {
'^@/(.*)$': '<rootDir>/src/$1',
'^@shared/(.*)$': '<rootDir>/../shared/$1',
}
}
Some thoughts:
- As I understand I have to tell to jest to apply same parsers (babel, etc) for the code outside of the rootDir.
- I guess it's possible to create a
tsconfig
in the root folder(fe
), but I want to launch unit tests fromfe/app1
folder... - Maybe it's possible to configure the things with such properties as
projects
,roots
and etc, but I'm out of luck so far.
I use Jest with Typescript. I want to create a monorepo. My folders structure is:
fe
|-app1
|--.jest.config.ts
|--tsconfig.json
|-shared
|--dummyData.ts
I want a unit test from app1
to access some data from shared
folder.
fe/app1/demo.spec.ts
:
import { someData } from '@shared/dummyData' //<--HERE: the alias is works, but jest can not understand "export" keyword
descrube('demo' () => {
it('demo test', () => {
expect(someData).toBe('DUMMY'));
})
})
fe/shared/dummyData.ts
:
export const someData = 'DUMMY';
The problem is that jest throws an error:
Jest encountered an unexpected token
{"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){export const someData = 'DUMMY';
^^^^^^
As I understand it cannot parse typescript or es6 modules that were produced by ts and babel.
The thing that it works fine while shared
folder is inside app1
, but once it's outside (and outside the root folder, i.g '<rootDir>/../shared/$1'
) it start throwing that error.
Here is my configs:
I described alias in fe/app1/tsconfig.json
:
{
...
"pilerOptions": {
"target": "esnext",
"module": "esnext",
"paths": {
"@/*": ["app/src/*"],
"@shared/*": ["shared/*"]
}
}
}
And in fe/app1/.jest.config.ts
:
module.exports = {
...
transform: {
'^.+\\.js$': '<rootDir>/node_modules/babel-jest',
'^.+\\.(jsx?|tsx?)$': 'ts-jest'
},
moduleNameMapper: {
'^@/(.*)$': '<rootDir>/src/$1',
'^@shared/(.*)$': '<rootDir>/../shared/$1',
}
}
Some thoughts:
- As I understand I have to tell to jest to apply same parsers (babel, etc) for the code outside of the rootDir.
- I guess it's possible to create a
tsconfig
in the root folder(fe
), but I want to launch unit tests fromfe/app1
folder... - Maybe it's possible to configure the things with such properties as
projects
,roots
and etc, but I'm out of luck so far.
- How did you setup jest in your monorepo? – Kimi Raikkonen 9790 Commented Nov 28, 2022 at 14:22
1 Answer
Reset to default 5Okay, I found the solution:
For monorepo it is important to have babel config as a JS file
So, simply rename .babelrc
to babel.config.js
(in the folder you called jest from, in my case it is fe/app1
)
For more info you could check this ment (and maybe this thread)