我正在尝试使用TypeScript的路径功能,这样我就不需要再使用相对导入了。
下面是我的 tsconfig.json 文件:
{
"compilerOptions": {
"target": "es5",
"module": "commonjs",
"strict": true,
"esModuleInterop": true,
"outDir": "./dist",
"rootDir": ".",
"moduleResolution": "node",
"allowSyntheticDefaultImports": true,
"resolveJsonModule": true,
"baseUrl": ".",
"allowJs": true,
"paths": {
"*": ["node_modules/*", "src/*"],
"@config/*": ["src/config/*"],
"@controllers/*": ["src/controllers/*"],
"@middlewares/*": ["src/middlewares/*"],
"@models/*": ["src/models/*"],
"@routes/*": ["src/routes/*"],
"@types/*": ["src/types/*"],
"@utils/*": ["src/utils/*"]
}
},
"include": ["src/**/*"],
"exclude": ["node_modules", "firebase-config.json", "webpack.config.js"]
}
下面是我的 package.json 文件:
{
"name": "express-ts-boilerplate",
"version": "0.1.0",
"description": "Express Typescript Boilerplate",
"main": "src/server.js",
"author": "Sriram R",
"scripts": {
"start": "NODE_ENV=production node dist/src/app.js",
"dev": "nodemon src/app.ts",
"build": "tsc -p .",
"test": "mocha --exit -r ts-node/register src/tests/*.spec.ts"
},
"dependencies": {
// Dependencies here
},
"devDependencies": {
// Dependencies here
},
}
所以现在在我的一个文件中,我尝试@config/typeConfig
,但我只是得到cannot find module
错误。
也许是因为nodemon
的原因,但它在ts-node
上也不起作用。我怎么才能让它起作用呢?
6条答案
按热度按时间mec1mxoz1#
注意:对于一个使用 nodemon 的工作示例,请跳到我的答案的第二部分。
如果你的意思是一旦你编译了文件并运行了应用程序,模块就找不到了,那么看看这个线程:Module path maps are not resolved in emitted code
“paths”是为与允许重Map的加载器一起使用而设计的
假设我的 * tsconfig.json * 中有以下路径:
我需要一个文件使用该路径在一个文件
查看编译后的文件,最后得到
正如你所看到的,路径没有被解析,它仍然是@config/test。当使用 nodemon 和 ts-node 测试你的应用时,也会发生同样的事情。
此外,您需要使用Typescript路径别名解析器,例如tspath。
TypeScript编译器将能够解析路径,因此这将编译没有问题,但是JavaScript输出将不可能通过Node或Web浏览器执行,为什么?原因很简单!
JavaScript引擎对编译时TypeScript配置一无所知。
为了运行JavaScript代码,现在需要再次将路径别名转换为相对路径,此时TSPath开始发挥作用。
也就是说,如果你想让事情与 nodemon 一起工作,下面的配置就可以了。事先,确保你安装了tsconfig-paths。
使用此函数加载模块,模块的位置在tsconfig.json的paths部分指定。支持运行时加载和API加载。(...)如果需要此包的tsconfig-paths/register模块,则会从tsconfig.json读取路径,并将节点的模块加载调用转换为节点可以加载的物理文件路径。
完美,我们将使用
-r tsconfig-paths/register
执行node
以将路径转换为物理文件路径,并使用-r ts-node/register
动态执行ts文件,nodemon 将在更改时重新启动应用程序。在你的 package.json 中,你需要添加这个(根据需要修改):
请注意为 nodemon 添加的配置。
最后
一切都应该很顺利。
jjhzyzn02#
jperl的回答完全正确。
但如果您想要一个简单的解决方案:
只需 * 记住 * 安装 tsconfig-paths/register:
ohtdti5x3#
发展
tsconfig.json
package.json
版本
tsconfig.json
package.json
pb3skfrl4#
在我的特殊情况下,使用“tsc-alias”,这是我的步骤:
1.安装软件包
npm install --save-dev tsc-alias
1.将我在package.json中编译的命令更改为
"build": "tsc && tsc-alias"
1.修改我的tsconfig.json,因为我没有outDir,所以它看起来像这样:
注意:如果不添加outDir,则会出现以下错误:“未设置compilerOptions.outDir”
在导入时,我会:
import {Util} from "lib/my/path/util";
nuypyhwy5#
TL;DR:删除所有.js文件
对于那些没有使用上述正确解决方案的人:
在我的项目中,我在每个.ts文件下创建了“剩余”的.js文件(在过去的某个时候)。运行
nodemon
(反过来应该使用tsc
)不会覆盖这些文件,并且我一直得到相同的Cannot resolve module
要求堆栈错误。删除所有.js文件为我修复了它。
有关如何以安全的方式实际操作的更多信息,请参阅此答案:Find (and delete) all files with a specified extension.请确保在删除文件之前确实查看了文件列表。
ny6fqffe6#
**第一步。**我们需要安装tsconfig-paths
npm i -D tsconfig-paths
第二步.在根路径下创建nodemon.json文件,与package.json同级
**第三步。**将下面的代码复制粘贴到nodemon.json文件中,代码中./src/app.ts这部分是一个快速执行点,请根据自己的情况进行修改。
**最后一步。**在package.json文件中编写执行脚本代码