如何添加TS文件以在产品中启动vue3应用程序

Question

当前文件夹结构：

/appname/server.js
/appname/package.json

当前包.json

"scripts": 
{
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"start": "node server.js",
},

我想使用TS编写serve.js。我知道如何在典型的TS项目中做到这一点，但当涉及到webpacks时，我无法做到。如果我将tsconfig更新为includeServe.ts，js文件最终不会出现在dist文件夹中。

想要的文件夹结构：

/appname/server.ts
/appname/package.json

通缉包.json

"scripts": 
{
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"start": "node dist/server.js",
},

更为复杂的是，需要dist文件夹来驱动应用程序，所以我不想搞砸它，将server.js放在不同的文件夹中可能是更好的方法。

Answer 1

您可以使用ts-node直接运行server.ts：

1. 将ts-node安装为devDependency:

   npm i -D ts-node
   

2. 更新NPM脚本以使用ts-node而不是node:

   {
   "scripts": {
   "start": "ts-node server.ts"
   }
   }
   

或者您可以使用npx ts-node:避免devDependency

{
"scripts": {
"start": "npx ts-node server.ts"
}
}