2

我看到了一些关于这个问题的问题,它们都不起作用我有一个 nodejs 项目和 Typescript。我不喜欢使用相对路径。在 tsconfig 中设置路径时出现以下错误:

找不到模块'@app/controllers/main'

// main.ts
export const fullName = "xxxx";
...

// app.ts
import { fullName } from '@app/controllers/main'
...

这是我的项目的结构:

-node_modules
-src
----controllers
---------------main.ts
----app.ts
-package.json
-tsconfig.json

配置:

{
    "compilerOptions": {
        "target": "es5",
        "module": "commonjs",
        "strict": true,
        "baseUrl": ".",
        "paths": {
            "@app/*": ["src/*"]
        },
        "esModuleInterop": true,
        "skipLibCheck": true,
        "forceConsistentCasingInFileNames": true
    }
}

我的问题在哪里?

提前致谢。

4

4 回答 4

9

不幸的是(我不知道为什么)Typescript 编译器目前不能很好地支持路径转换。

这是我的解决方案:

我在这个项目中使用了该解决方案。

安装 devDependencies

  1. ttypescript -> npm install ttypescript --save-dev -> TTypescript (Transformer TypeScript) 通过动态修补编译模块以使用来自 tsconfig.json 的转换器来解决问题。
  2. typescript-transform-paths -> npm install typescript-transform-paths --save-dev -> 将绝对导入转换为 tsconfig.json 中路径的相对导入。
  3. tsconfig-paths -> npm install tsconfig-paths --save-dev -> 使用它来加载位置在 tsconfig.json 的路径部分中指定的模块。支持在运行时加载和通过 API 加载。
  4. ts-node-dev -> npm install ts-node-dev --save-dev -> 当任何所需文件更改时(作为标准 node-dev)重新启动目标节点进程,但在重新启动之间共享 Typescript 编译过程

tsconfig.json

使用以下选项更新tsconfig.json文件:

{
    "compilerOptions": {
        /* A series of entries which re-map imports to lookup locations relative to the 'baseUrl'. */
        "paths": {
            "@app/*": [
                "./src/*"
            ]
        },
        /* Advanced Options */
        "plugins": [
            {
                "transform": "typescript-transform-paths"
            }
        ],
    }
}

建造

对于编译阶段,使用ttsc而不是tsc和配置文件。请参阅下面的片段:

npx ttsc --p ./tsconfig.json

带自动重载的开发模式

当您处于开发模式时,使用以下脚本(将其放在 package.json 中的脚本选项中)以使用正确的路径自动重新加载项目。src/app.ts是位于src文件夹下的应用程序的“入口点” 。

npx ts-node-dev --prefer-ts true --no-notify -r tsconfig-paths/register --watch src --transpileOnly src/app.ts

PS:使用 ts-node-dev 显着提高速度。

于 2020-09-04T17:02:49.270 回答
2

你的语法是正确的。

在撰写本文时,ts-node-dev似乎不paths支持tsconfig.json.

github 问题讨论了该问题并提供了解决方法选项。

于 2020-09-04T16:43:34.543 回答
1

我稍微调整了@Carlo Corradini 的回答,这是我解决此问题的方法。

  1. 安装所需的插件: npm i -D ttypescript typescript-transform-paths ts-node tsconfig-paths. 这些包将帮助我们改变路径。
    ttypescript-> https://www.npmjs.com/package/ttypescript

  2. 然后,在 tsconfig.json 上,我输入:

    {
    
     "ts-node": {
       "transpileOnly": true,
       "require": [  // set this so you dont need to use ts-node -r 
         "typescript-transform-paths/register",
         "tsconfig-paths/register"
        ]
     },         
     "compilerOptions": {
        "composite": true,
        "rootDir": ".", // must define
        "baseUrl": "src", // must define, the paths will relative to this
        "outDir": "lib", 
        "skipLibCheck": false,
        "paths": {
         "@app/*": ["./*"],
         "@controllers/*": ["./controllers/*"],
        },
         "plugins": [
           { "transform": "typescript-transform-paths" }
         ]
     }
    }
    
  3. 然后在您的代码上,您可以使用:

    import myControllers from "@controllers/main.ts"
    
  4. 现在你可以编译了,npx ttsc -p tsconfig.json

  5. 并在 ts-node 上运行npx ts-node -p tsconfig.json src/app.ts

于 2021-09-24T03:48:15.730 回答
0

我在 tsconfig.json 文件的某个地方看到了这个:

{ 
  "compilerOptions": {
    ...other rules,
    "baseUrl": "./src"
  },
  "include": ["src"]
}

有效

于 2021-11-04T12:33:00.317 回答