缺少 *.ts 文件（由于 `npm link` ？）

Posted 2023-02-16

【中文标题】缺少 *.ts 文件（由于 `npm link` ？）

【英文标题】：Missing *.ts files (due to `npm link` ?)

【发布时间】：2018-07-25 14:43:16

【问题描述】：

我在一个 Angular5 项目中有这个导入语句：

import plugins, SCECodeGenType from 'sce-plugins/code-generation';

这将解析为我的文件系统上的此路径：

/Users/.../suman-chrome-extension/node_modules/sce-plugins/code-generation/index.d.ts

使用ng build -w 构建应用程序时，我收到此错误：

ERROR in ../sce-plugins/code-generation/index.ts Module build failed: Error: /Users/alexamil/WebstormProjects/oresoftware/sumanjs/sce-plugins/code-generation/index.ts is missing from the TypeScript compilation. Please make sure it is in your tsconfig via the 'files' or 'include' property.
    at AngularCompilerPlugin.getCompiledFile (/Users/alexamil/WebstormProjects/oresoftware/sumanjs/suman-chrome-extension/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:662:23)
    at plugin.done.then (/Users/alexamil/WebstormProjects/oresoftware/sumanjs/suman-chrome-extension/node_modules/@ngtools/webpack/src/loader.js:467:39)
    at <anonymous>  @ ./src/app/shared/services/lang.service.ts 14:24-62  @ ./src/app/app.module.ts  @ ./src/main.ts  @ multi ./src/main.ts

我相信是因为我使用npm link链接'sce-plugins'项目进行本地开发。

我在这里看到了将npm link 与 Angular5 项目一起使用的一些问题：

https://github.com/angular/angular-cli/issues/3875

https://github.com/angular/angular-cli/issues/8677

https://github.com/angular/angular-cli/issues/9376

有人知道怎么解决吗？

更新：

它似乎与 npm link 本身或符号链接无关。如果我只是将本地目录复制到node_modules/sce-plugins，我会得到同样该死的错误。 然而，如果我 npm install sce-plugins 进入 node_modules 那么我确实 不 得到错误。很奇怪，好像和angular-cli有关，不是NPM。

【问题讨论】：

即使我使用'sce-plugins/code-generation/index'，我实际上仍然得到同样的错误，奇怪

我使用npm link 来包含sce-plugins 代码，但sce-plugins 也在我的依赖项数组中

【参考方案1】：

所以在再次阅读这个 Github 问题后： https://github.com/angular/angular-cli/issues/8284

我在.angular-cli.json：

  "defaults": 
    "build": 
      "preserveSymlinks": true //   <<<< add this
    ,
    "styleExt": "scss",
    "component": 
    
  

现在，鉴于 preserveSymlinks 标志和我的 tsconfig.app.json 文件中的包含字段：

 "include":[
    "./**/*.ts",
    "../node_modules/sce-plugins/**/*.ts"
  ],

我现在可以将'sce-plugins' 符号链接到我的主项目中，而不是手动复制文件。您可能根本不需要 "include" 字段，尽管我发现如果我删除了 "include" 字段，它将无法正常工作。

【讨论】：

我相信这已更改为projects -> [project] -> architect -> build -> options -> preserveSymlinks

【参考方案2】：

在 Angular 6“angular.json”文件中，需要将“preserveSymlinks”放在“options”下 示例：

"defaults": 
        "build": 
          "builder": "@angular-devkit/build-angular:browser",
          "options": 
            "preserveSymlinks": true,
            "outputPath": "dist/ConsoleClient",
            "index": "src/index.html",
            "main": "src/main.ts",
            "polyfills": "src/polyfills.ts",
            "tsConfig": "src/tsconfig.app.json",
            "assets": [
              "src/favicon.ico",
              "src/assets",
              "src/web.config"
            ],

【参考方案3】：

我在将应用程序从 Angular 5 迁移到 6 时遇到了同样的问题，我已申请修复：

在 tsconfig.app.json 的 includes array 中添加了丢失文件的条目（注意：文件名不是 tsconfig.json）

另外，请确保您提到的丢失文件的路径是相对于 tsconfig.app.json

【参考方案4】：

这可能是由 import 的 URL 中区分大小写的拼写错误引起的。

ng build 输出的“堆栈跟踪”不会（或者我应该说可能不会）将您指向正确的位置。就我而言，我在 Visual Studio 中对文件名（不包括 .ts）进行了全局搜索，并找到了对模型定义文件的引用：

import  ItemsUsedEntry  from '../models/itemsUsedentry.model';

而不是

import  ItemsUsedEntry  from '../models/itemsusedentry.model';

这很容易在 Visual Studio 全局“查找”窗口中找到，方法是扫描我在 itemsusedentry.model 上搜索的所有结果。