When we use Node.js to develop servers, we usually use TypeScript to develop large-scale projects. However, when we use ts-node for full compilation, we often encounter the problem of slow compilation speed. Usually, it takes two minutes to modify a line of code to compile. At this time, we need to use incremental compilation to optimize the compilation speed, and other files are fully compiled when the project is started, and whichever TS file is modified during development will be compiled into the corresponding JS file.
development environment
1. Modify the tscon.json file
{
"compilerOptions": {
"watch": true
}
}Turn on watch in the ts configuration to monitor all ts files in the rootDir path (there will be my tsconfig.json at the end of the article)
2. Write a program
Write dev.js as the project development startup file, encapsulate Node.js's own method to move folders to copy files such as public folders and .env files, start tsc incremental compilation, and monitor the tsc operation results. After the first successful operation, start using the shell to Run the compiled dist folder
I will put the gitee link at the bottom of the article for the whole demo.
const fs = require('fs');
const path = require('path');
const clearDir = require('./modules/clearDir');//delete entire folder
const copyDir = require('./modules/copyDir');//copy folder
const countFile = require('./modules/countFile');//Count the number of files in a folder
clearDir('dist'); //empty dist
fs.mkdirSync('dist') //create dist
copyDir('public', 'dist/public'); //copy public
fs.writeFileSync('dist/.env.development', fs.readFileSync('.env.development').toString()) //Copy the environment variable file
// start executing tsc
const shell = require('shelljs');
const tsCount = countFile(path.join(__dirname, '../src')) //Get the number of ts files and compare JS in real time
const _tsc = shell.exec('tsc', {
async: true
});
// Real-time comparison of the number of TS and JS
new Promise((resolve, reject) => {
_tsc.stdout.on('data', function (data) {
let src = path.join(__dirname, '../dist/src');
if (fs.existsSync(src)) {
let timer = setInterval(() => {
let jsCount = countFile('./dist/src')
if (jsCount == tsCount) {
clearInterval(timer)
resolve()
}
}, 50);
}
});
}).then(() => {
shell.exec('cross-env ENV=development nodemon --watch ./dist ./dist/src/index.js', {
async: true
});
})I emptied the dist folder, copied the public folder, and migrated the environment variable files.
the whole idea:
Initialize the required static folder, start the operation of tsc, and monitor whether the number of ts files in the source code and the number of js files in dist are the same. After the src folder is all packaged, start using nodemon to run the dist folder, so that you only need to run the corresponding js, which greatly speeds up the hot update speed.
Many students use ts path aliases when developing with ts, and use the module-alias plug-in to solve the problem, but package.json under dist needs to be modified. For details on using path aliases in node.js, please refer to this article. Using type aliases in TypeScript
Bale
const fs = require('fs');
const shell = require('shelljs');
const path = require('path');
const clearDir = require('./modules/clearDir')
const copyDir = require('./modules/copyDir');
const countFile = require('./modules/countFile');
clearDir('dist'); //empty dist
fs.mkdirSync('dist')
const _tsc = shell.exec('tsc', {
async: true
});
copyDir('public', 'dist/public'); //copy public
fs.writeFileSync('dist/package.json', fs.readFileSync('package.json').toString())
fs.writeFileSync('dist/yarn.lock', fs.readFileSync('yarn.lock').toString())
fs.writeFileSync('dist/.env.production', fs.readFileSync('.env.production').toString())
const tsCount = countFile(path.join(__dirname, '../src')) //Get the number of ts files and compare JS in real time
new Promise((resolve, reject) => {
_tsc.stdout.on('data', function (data) {
let src = path.join(__dirname, '../dist/src');
if (fs.existsSync(src)) {
let timer = setInterval(() => {
let jsCount = countFile('./dist/src');
if (jsCount == tsCount) {
clearInterval(timer)
resolve()
}
}, 50);
}
});
}).then(() => {
console.log(`Packaging is complete,SRC under the total ${tsCount} files`);
shell.exit(1)
})The principle is similar to development, but the moved folder is different, and you can exit directly after tsc ends
A Koa+TypeScript template, ORM uses Sequelize, TS adds incremental compilation and type aliases, Koa is basically debugged, automatically introduces Router and configures static files
Basically, Koa+TS can be downloaded and used, and the running command is in Readme.md
copygit clone https://gitee.com/awebcoder/koa-ts.git
tsconfig.json
{
"compilerOptions": {
"experimentalDecorators": true,
"target": "ES2015",
"module": "commonjs",
"outDir": "./dist",
"rootDir": "./",
"moduleResolution": "node",
//Variable and function arguments are not used warning
// "noUnusedLocals": true,
// "noUnusedParameters": true,
"removeComments": true, //uncomment
"strict": true,
"baseUrl": "./",
"paths": {
"@/*": ["src/*"]
},
"skipLibCheck": true,
"esModuleInterop": true,
"noImplicitAny": true, // Implicit any type is not allowed
"watch": true
},
"include": ["src"],
"exclude": ["node_modules", "**/*.d.ts"]
}