Currently, I am working on a TypeScript UI page object model testing project and my main focus is to avoid messy nested imports as much as possible.
I came across the paths object in the .tsconfig file which helped resolve the issue in .ts files. However, due to compiling into an outDir, the compiled .js files are unable to resolve the module path.
My development work happens in a directory named model and the compilation occurs in a directory called src.
This is how my .tsconfig file is set up:
{
"compilerOptions": {
"target": "es6",
"module": "commonjs",
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"removeComments": true,
"noImplicitAny": false,
"outDir": "src/",
"baseUrl": "./model/",
"paths": {
"general.utils": [ "lib/general/general.utils" ],
"pretest.setup": [ "lib/pretest.setup/pretest.setup" ],
"tpapi": [ "lib/tpapi/tpapi" ],
"*": [ "*" ]
}
},
"exclude": [
"node_modules"
],
"compileOnSave": false
}
With the help of the paths configuration, I can now easily use:
import { chooseRandomValueFrom } from 'general.utils';This import works perfectly in a .ts file within the model directory but fails when used in a .js file situated in the src directory.
The project is managed using npm and executed with the command npm test. This command involves compiling, running tests, and cleaning up the src directory afterwards.
#!/bin/bash
npm run compile:ts
node_modules/webdriverio/bin/wdio
npm run clean:ts