For months I've dealt with having my.ts and.js files side by side inside of each folder because the app is in production and the conversion from JS to TS caused this inconvenience while still providing more benefits overall.
I got the folder structure to compile correctly after a bit of tinkering and reading the docs but there is 1 file that I can't include without breaking the structure and it's the root-level server.ts file.
The 'problem' files are shown with
/📁server (root)
📛server.js
📛server.ts (problem file)
/📁routes (dist folder)
/📁api
/📁v1
index.js
/📁accountDataFunctions
duplicates.js
notations.js
/📁accountImportFunctions
dataIntegrity.js
/📁dataFormatting
addressValidation.js
emailValidation.js
...
/📁sqlQueryGeneration
selectQuery.js
updateQuery.js
/📁src (dev folder)
/📁api
/📁v1
index.ts
/📁accountDataFunctions
duplicates.ts
notations.ts
/📁accountImportFunctions
dataIntegrity.ts
/📁dataFormatting
addressValidation.ts
emailValidation.ts
...
/📁sqlQueryGeneration
selectQuery.ts
updateQuery.ts
If I include server.ts
in the tsconfig.json
it will compile like this:
/📁routes (dist folder)
/📁src/📁api/📁v1
[...folder structure]
server.js
/📁api/📁v1
(empty)
The current configuration does everything correctly except that it neglects the server.ts
at the root level in the /server
folder.
/* tsconfig.json */
{
"compilerOptions": {
"target": "es6", /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019', 'ES2020', or 'ESNEXT'. */
"module": "commonjs", /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', 'es2020', or 'ESNext'. */
"outDir": "./routes", /* Redirect output structure to the directory. */
"rootDir": "./src", /* Specify the root directory of input files. Use to control the output directory structure with --outDir. */
"resolveJsonModule": true,
"removeComments": true, /* Do not emit comments to output. */
"strict": false, /* Enable all strict type-checking options. */
"baseUrl": "./src", /* Base directory to resolve non-absolute module names. */
"rootDirs": ["./","./src"], /* List of root folders whose combined content represents the structure of the project at runtime. */
"allowSyntheticDefaultImports": true, /* Allow default imports from modules with no default export. This does not affect code emit, just typechecking. */
"esModuleInterop": true, /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */
},
"exclude": ["node_modules"],
"include": [
"src/api/v1/index.ts",
"src/api/v1/**/*.ts"
]
}
Some of these have helped me get to this point, but they're different enough that I can't figure out how to adapt them.
tsconfig.json file outside of project directory
How to compile a specific file with tsc using the paths compiler option
group typescript files into more than one outFile
How can I specify multiple source folders in my tsconfig.json?
I'm running concurrently
as follows:
/* package.json */
"scripts": {
"start": "tsc && node server.js",
⭐"serve": "concurrently \"nodemon run server.js\" \"tsc -w\""
},
Preferably I'd like to be able to add an extra tsc
command to that to watch that single file
OR
I can add another tsconfig.json
file in IF there isn't a simpler solution in the original tsconfig.json
file.
FOLDER/FILE STRUCTURE
I need to keep the folder structure server/routes/api/v1/*
with the relative server.js
file in server
because of the CI/CD pipeline and the fact that this is already in production.
USING server.js
instead of server.ts
When attempting to exclude server.ts
, tons of import/esmodule bugs pop up. server.js
is ultimately the file that controls everything from including routing, daemon, and permissions. It's a small file but it controls a lot of things so there are a lot of connections between server.ts
and many other .ts
files throughout the server.
For anyone else who may run into this problem, here are a few of the solutions I found:
routes/
was renamed to dist/
and then server.ts was moved from /
into src
and the outfile was set to dist/
This required a few modifications to my CI/CD pipeline but overall it saved me a ton of time to just bite that bullet.
files
to the tsconfig.json
file:/* tsconfig.json */
{
"compilerOptions": {
"target": "es6",
...
},
"exclude": ["node_modules"],
"include": [
"src/api/v1/index.ts",
"src/api/v1/**/*.ts"
],
"files": ["server.ts", "api/v1/index.ts"]
}
tsconfig.json
down 1 level if possible - the production app is compiled from TypeScript so it doesn't matter if it's slightly less than ideal for production when tsconfig.json
, src/
, and server.ts
aren't making it into the build. They're just for development.My folder structure was set up as follows:
📁project
tsconfig.json (include server, exclude client)
📁server
📁client
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.