我有一个Web应用程序,其中包含NodeJS服务器应用程序和Angular 7客户端应用程序。我在服务器端和客户端使用相同的组件类型,因此在两个项目之外的node_modules文件夹中都有接口:
repos/myWebApp/
client/
node_modules/
@angular/
...
src/
app/
app.module.ts
...
tsconfig.app.json
angular.json
package.json
tsconfig.json
node_modules/
shared/
classes/
sharedBase.ts
...
interfaces/
sharedBase.interface.ts
sharedModels.interface.ts
...
node_modules/
mongoose/
...
package.json
server/
src/
index.ts
...
package.json
tsconfig.json
我正在使用Visual Studio Community 2017(15.8.9)开发。编译服务器应用程序时,我有gulp任务,这些任务会将共享类从共享节点模块复制到客户端和服务器文件夹。一切工作都很好,直到几天前随机出现,AngularCLI中的Webpack开始给我一个编译错误,该错误是TypeScript编译中缺少sharedModels.interface.ts的。这是我客户的tsconfig.json:
{
"compileOnSave": false,
"compilerOptions": {
"outDir": "./dist/out-tsc",
"baseUrl": "src",
"sourceMap": true,
"declaration": false,
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"target": "esnext",
"typeRoots": [
"node_modules/@types"
],
"lib": [
"esnext",
"es2017",
"dom"
]
}
}
我可以通过在客户端的tsconfig.json中添加"include": [ "../node_modules/shared/*" ]
来解决AngularCLI错误,但是VS中的模块解析会中断。更具体地说:
// adding the "include" breaks imports like these, i.e. VS "cannot find module ___"
import { Component } from '@angular/core';
import { ISharedModels } from 'shared/interfaces/sharedModels.interface';
// imports like these, however, still work in VS
import { BaseComponent } from 'app/components/base.component';
我不确定这是VS本身的问题,还是我在VS中使用的TypeScript扩展,TypeScript,Angular,AngularCLI,它们的组合或两者之间的不一致。我试图更改我的baseURL,将路径添加到editorOptions,指定“文件”而不是“ include”,以及其他tsconfig选项,但我无法回到VS和AngularCLI都满意的情况。我仍然不确定是什么使他们不再合作。在过去的几个月中,使用此设置一直很好(我几周前更新到Angular 7)。