I currently have the following project structure:
project/
tsconfig.json
webpack.config.js
package.json
node_modules/
...lots of dependencies
typings/
...lots of .d.ts files for the dependencies
src/
...folders for files for my projects
My tsonfig.json
looks like:
{
"compilerOptions": {
"module": "commonjs",
"target": "es5",
"noImplicitAny": false,
"outDir": "./js",
"rootDir": "./src",
"sourceMap": true,
"jsx": "react"
},
"exclude": [
"typings/main.d.ts",
"typings/main",
"node_modules"
]
}
This all works very well and I can happily develop my application and run it in a browser.
I would now like to add some unit tests to my project and coming from a Java background my initial instinct is to place the tests in a separate folder:
project/
test/
...all of my test cases
Of course, the files in the test/
folder need to reference the code in my src/
folder. How do I set that up?
Or is it "better" to place the tests inline in the src/
folder and have a separate webpack.config.js
file for them?
Really confused about how this works in practice in larger TypeScript projects.
Note: I have seen this but found the answer less than illuminating. It seems that the referenced feature discussion about filesGlob
would help me, but I just wonder how people are doing this today?
json file is a file of JSON format which allows us to point the root level files and different compiler options to setup that require to compile a TypeScript based projects. The existence of this file in a project specifies that the given directory is the TypeScript project folder root.
rootDirs can be used to provide a separate “type layer” to files that are not TypeScript or JavaScript by providing a home for generated .d.ts files in another folder. This technique is useful for bundled applications where you use import of files that aren't necessarily code: sh.
The include and exclude properties take a list of glob-like file patterns. The supported glob wildcards are: * matches zero or more characters (excluding directory separators) ? matches any one character (excluding directory separators)
Now other than rootDir
, you can use rootDirs
"rootDirs": ["./scripts", "./src"],
for multiple folders.
Here is the API doc: https://www.typescriptlang.org/docs/handbook/module-resolution.html#virtual-directories-with-rootdirs
I think you are looking for path mapping. With the paths
compiler option, you can specify not only a mapping to a single location but to several. This is the example from the documentation:
"compilerOptions": {
"baseUrl": ".",
"paths": {
"*": [
"*",
"generated/*"
]
}
}
If the compiler does not find a module in the expected location, it repeats module resolution in the "generated" subfolder. The baseUrl
setting seems redundant but it is mandatory.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With