Angular 5: NPM Link - model/index.ts is not part of the compilation.

Bug Report or Feature Request (mark with an `x`)

- [x] bug report -> please search issues before submitting
- [ ] feature request

Versions.

Angular CLI: 1.5.0
Node: 8.7.0
OS: darwin x64
Angular: 5.0.0

Repro steps.

We have a the following folder structure in a git mono-repo

/api (Express Node App)
/model (NPM package using NPM Link, contains mostly typescript interfaces)
/web (Angular)

When using Angular 4.46 and Angular CLI 1.5.rc2 and we were able to make reference to the interfaces defined in the model folder using npm link and using the following example
import { entity } @app/model

We use ng serve to start the app.

After upgrading Angular to V5 and Angular CLI to 1.5.0 we now get the following error -

The log given by the failure.

Module build failed: Error: /Users/thaoula/Projects/platform/model/index.ts is not part of the compilation. Please make sure it is in your tsconfig via the 'files' or 'include' property.

The occurs for JIT and AOT builds.
Running TSC does not result in in errors.

Desired functionality.

Would like be able to build the app using Angular 5

Thanks,
Tarek

I can report a similar issue.
Key differences:

I'm not using npm link, I've just installed another git repo via npm with typescript source (ie. original .ts files).
The error I'm getting is: node_modules/other-repo/src/lib/index.ts is not part of the compilation output. Please check the other error messages for details.

Was previously working fine with Angular 4.4.6 and Angular CLI 1.4.7

I'll try to create a minimal repo to reproduce the issue once I get home.

yes i m also faced this issue .
angular 5 rc 9 and clic 1.5.0

me too

Same here - without npm link, but with dependencies on typescript libraries in other git repositories

I've been testing with several version combinations to flush this out and it seems like it's the CLI causing it. I'm running v1.5.0 with Angular on v5.0.0 final and a similar error shows. Rolling the CLI back to rc8 fixes it.

Then I reverted 9b43a9c manually and the error subsides.

I've found that I only get the problem with ng serve - not with ng build.
Specifically: ng build --aot --prod --sourcemaps --stats-json --delete-output-path=false --progress=false

@diagramatics

I can confirm what @diagramatics said about rolling back to rc8 working, but I didn't get the same joy from reverting 9b43a9c
I also noticed that I get the same error when running ng test (ie. X is not part of the compilation output.) - even with rc8.

@thaoula

Hey all, this is a side effect of the stricter tsconfig as described in https://blog.angular.io/version-5-0-0-of-angular-now-available-37e414935ced#148d.

The tsconfig file is what determines what TS files are compiled. The error you are getting means that the files mentioned are NOT being compiled.

Before we used to compile all files, essentially ignoring what tsconfig listed. This was a bug, because if you don't include a file in the compilation then it should not be compiled.

By default ./src/tsconfig.app.json will only pick up files inside src/. If you have a file outside source, it won't be picked up. But you can add more files to the tsconfig via either files or include.

So for @thaoula's case, you probably want to add this the files in ../models to your tsconfig.app.json and also to your tsconfig.spec.json:

{
  "extends": "../tsconfig.json",
  "compilerOptions": {
    // ...
  },
  "include": [
    "../models/**/*.ts"
  ],
  "exclude": [
    // ...
  ],
}

You can read more about tsconfig files in https://github.com/Microsoft/TypeScript-Handbook/blob/master/pages/tsconfig.json.md.

@rolaveric's case is slightly different. You have TS files in your node_modules. This really goes against how libraries should be packaged: libraries should never ship their source .ts files.

The reason for this rule is that the TypeScript version your app isn't necessarily the same as the TS version your library uses. Different versions of TS can produce different output, and give different errors for the same input. They don't even support the same language features. So packaging libraries with TS sources will always break someone's project.

So we don't really support using incorrectly packaged libraries with TS sources. It's something you do at your risk.

That being said, maybe you can try adding it to the include array. But I can't guarantee that will work in the future because it's still an incorrectly packaged library.

Regarding AOT: as far as I can tell, AOT is still incorrectly compiling TS that is not included in the tsconfig. I'll bring this up with the compiler team. (Edit: reported as angular/angular#20115)

@thaoula

We have the same problem described by @thaoula , but for a file that is located inside the normal tree structure created by the angular-cli. The error occurs with angular 5.0.0 final and angular-cli 1.5. We can "ng serve" the app with angular 5.0.0 and angular-cli 1.4.4.

The file that is not part of the compilation in our project is located at:
src/app/core/stateManagement/Models/genericCourse.ts

We never included or excluded files using tsconfig.json so it doesn't seem that the problem comes from the stricker tsconfig usage describeb above. To make sure, I created an empty project using angular-cli 1.5.0 and replaced the tsconfig.json and tsconfig.app.json files in our project with the ones created by the new cli and it didn't solve the problem.

Another thing we have in commun with @thaoula is that the file that is not included in the compilation only contains interface and class definitions. So there might be something with that.

@MakesNine

@MakesNine that sounds like a different issue altogether, and one that we thought was fixed. Could you give me a repro of that please?

We are having a similar issue, as well, after upgrading. It is complaining about all of our library packages under node_modules with this same exact error (all packages are installed with NPM so no links). Are we going to have to "include" each package separately in the tsconfig file? This would be a nightmare if its true, now and for maintenance in the future. Is there another solution or something else we can do first before using this new version which obviously breaks us completely?

@filipesilva

@filipesilva I have been trying to reproduce the problem in a small project, but I haven't succeded so far. I will keep trying to isolate the problem to find the source of it.

Here's the exact error I'm getting:

ERROR in ./src/app/core/StateManagement/models/genericCourse.models.ts
Module build failed: Error: D:\Projects\LtiisWeb\src\app\core\StateManagement\models\genericCourse.models.ts is not part o
f the compilation. Please make sure it is in your tsconfig via the 'files' or 'include' property.
at AngularCompilerPlugin.getCompiledFile (D:\Projects\LtiisWeb\node_modules@ngtools\webpack\src\angular_compiler_plug
in.js:624:23)
at plugin.done.then (D:\Projects\LtiisWeb\node_modules@ngtools\webpack\src\loader.js:467:39)
@ ./src/app/+generic-courses/generic-course.component.ts 23:0-84
@ ./src/app/+generic-courses/generic-courses.module.ts
@ ./src/$$_lazy_route_resource lazy
@ ./node_modules/@angular/core/esm5/core.js
@ ./src/main.ts
@ multi webpack-dev-server/client?http://0.0.0.0:0 ./src/main.ts

@filipesilva

@filipesilva. I am facing the same issue Just to summarize, we have a large project. So 1 project is used as library and sits in the node_modules folder. When on Angular 4 it works fine but when upgraded it is throwing me this error: Module build failed: XXX file is missing in Typescript compilation. Please make sure it is in your tsconfig via the 'files' or 'include' property. I have read this whole ticket and specially implemented what you suggested of manually adding it in tsconfig.json. But when I do that it prompts me a different error: Unknown compiler option 'include' and 'exclude'. It would be great help if you could get me out of this issue. Thank you in advance. Just to reiterate I have read through the whole blog and tried different solutions it does not seem to work. Again Thank you in advance.

@andi-wr Thank you for the solution but it still does not work. It gives me whole lot of errors. Saying cannot find name 'describe'; cannot find name 'beforeEach' etc in all the files. This is a huge list of errors.

@filipesilva

@filipesilva
I am getting the below error and the third party literary do not have .ts file. can you help

ERROR in ./node_modules/agm-direction/src/agm-direction.module.ts
Module build failed: Error: D:\TandT\TandTSrc\node_modules\agm-direction\src\agm-direction.module.ts is missing from the TypeScript compilation. Please make sure it is in your tsconfig via the 'files' or 'include' property.
The missing file seems to be part of a third party library. TS files in published libraries are often a sign of a badly packaged library. Please open an issue in the library repository to alert its author and ask them to package the library using the Angular Package Format (https://goo.gl/jB3GVv).
at AngularCompilerPlugin.getCompiledFile (D:\TandT\TandTSrc\node_modules@ngtools\webpack\src\angular_compiler_plugin.js:656:23)
at plugin.done.then (D:\TandT\TandTSrc\node_modules@ngtools\webpack\src\loader.js:467:39)
at
at process._tickCallback (internal/process/next_tick.js:169:7)
@ ./node_modules/agm-direction/index.js 6:9-46
@ ./src/app/app.module.ts
@ ./src/main.ts
@ multi ./src/main.ts

@filipesilva

I don't know if people are still having this problem - here's how I fixed the issue.

I have 2 tsconfig.json files, one at the root of the app, and the other inside the src folder (one level down from the root) named tsconfig.app.json that extends the main tsconfig.json. I explicitly added the package that I needed that wasn't being transpiled by Typescript in the "include" array, and like a lot of people here I was getting the *.spec.ts files included despite having them in "exclude" option, so I removed it from the tsconfig.json. The fix was adding the "exclude" option to the second (extended) tsconfig.app.json file. Doing that fixes the Typescript errors and lets me run ng serve without issue.

Here is tsconfig.json:

{
"compileOnSave": false,
"compilerOptions": {
"baseUrl": "./src",
"outDir": "./dist",
"sourceMap": true,
"declaration": false,
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"target": "es5",
"typeRoots": [
"node_modules/@types"
],
"lib": [
"es2017",
"dom"
],
},
"include": [
"./src",
"node_modules/your_package"
]
}

And tsconfig.app.json:

{
"extends": "../tsconfig.json",
"compilerOptions": {
"outDir": "../dist",
"baseUrl": "./",
"module": "es2015",
"types": []
},
"exclude": [
"../node_modules/your_package/**/*.spec.ts"
]
}

For some reason adding the exclude in the extended tsconfig (tsconfig.app.json) file is the only way I was able to get it to not complain about the spec files.

Based on the comments from @filipesilva this may still be a bug but it worked for me. Hopefully this helps anyone facing the same issue.

@tapaz1

@tapaz1 By following your instruction, I got it work. I added a section of include in tsconfig.json to include the failed module as below:

"include": ["./src", "node_modules/@jaspero/ng2-select"]

then build success. Thank you!

we used to compile all files, essentially ignoring what tsconfig listed. This was a bug

IMHO, the new behavior of failing when the compiler wasn't asked to compile a file it wasn't supposed to compile in the first place is also a bug.

we don't really support using incorrectly packaged libraries

npm link is supported by, well, NPM, so it seems odd that angular doesn't. In particular, I've got this in in my .npmignore:

*.ts
!*.d.ts

So that TypeScript files are not included when I npm publish. Perhaps angular could also respect .npmignore files ,and only complain when a .ts file that would be included in a published package is encountered. This would resolve the problems that devs who co-develop an angular site and a related npm package have with this new behavior.

I realize that my situation may be more complicated than most. I've got an angular app and 3 independent NPM packages that I'm working on, where my app depends on all 3 packages, and one of the packages depends on the other two. Two days of googling, RTFMing, and trying every combination of exclude:["foo","bar","bat"] haven't worked for me. (thought oddly "including" them does work, though it brings up another host of other errors b/c I use different versions fo pacakges in my dependences, so there are collisions with the typings between my app's dependencies and my dependencies dependencies.)

In the end, I npm pack'ed my dependencies, installed them in my app from the built .tgz files, put build scripts in my package.json for all my dependencies like so:

npm pack && pushd /my/app/ && npm i /my/dependency/dependency.tgz && popd

all because of this paternalisticl error, that obstructs the use of npm link -- which is a mode of development tool explicitly supported by NPM!

In future, can this be warning instead of an error, or perhaps add a cli flag indicating that no error should be raised just because angular wasn't asked to compile every .ts file it can find?

Workaround:

This error is thrown when loading .js files and .map files, and not when deciding which .ts files to compile. Hence, if:

you are using npm link or npm i file:/my/other/package to co-develop an angular app and a node package and
you have "sourceMap": true, in the compiler options of your linked package, and
you have called tsc in your linked repo,

then you can go to the line that threw the error, which is listed in the output from ng serve and comment out the line throw new Error(msg);, and you're off to the races.

The downside to this workaround is that while your ng-serveer will reload your app every time you make changes in your dependency projects -- but it won't compile them and you'll have to restart ng-serve after calling tsc in your dependency in order for updates in your dependencies to be picked up.

In short, the workaround sucks, but at least it doesn't prevent you from doing development on separate projects with separate dependencies and typings.

fix(@ngtools/webpack): improve missing TS file error message

Important to work with shared as npm link: "preserveSymlinks": true

add in tsconfig.app
"baseUrl": ""
for
"baseUrl": ""

Hi all,

This thread was opened a while ago.

The tsconfig file is what determines what TS files are compiled. The error you are getting means that the files mentioned are not being compiled as explained in the following comment #8284 (comment).

Having all the feedback in a single thread makes it hard to get meaningful reports, or to inform people of what versions the regressions that affect them were fixed.

Having so many hidden comments makes it hard for people to find the information in anything but the latest comments. But on the other hand I don't think most people would go through all of the comments anyway. New users that see this thread mostly read the first and latest comments and lose things said in between.

So for the reasons stated above (high volume of comments, hidden comments, hard to report and inform people) I'm also locking this issue to prevent this comment from being lost as new comments come in.

If you are still experiencing an issue please open a new issue, provide a simple repository reproducing the problem, and describe the difference between the expected and current behavior.

Navigation Menu

Repository navigation

Angular 5: NPM Link - model/index.ts is not part of the compilation. #8284

Bug Report or Feature Request (mark with an `x`)

Versions.

Repro steps.

The log given by the failure.

Desired functionality.

83 remaining items

Workaround:

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Angular 5: NPM Link - model/index.ts is not part of the compilation. #8284

Description

Bug Report or Feature Request (mark with an x)

Versions.

Repro steps.

The log given by the failure.

Desired functionality.

Activity

rolaveric commented on Nov 2, 2017

suresh2018 commented on Nov 2, 2017

xiongyayun428 commented on Nov 2, 2017

ChristianSchroedel commented on Nov 2, 2017

diagramatics commented on Nov 2, 2017

rolaveric commented on Nov 2, 2017

rolaveric commented on Nov 2, 2017

filipesilva commented on Nov 2, 2017

MakesNine commented on Nov 2, 2017

filipesilva commented on Nov 2, 2017

KevinFernandes commented on Nov 2, 2017

MakesNine commented on Nov 2, 2017

83 remaining items

kaushikdighe commented on Feb 16, 2018

kaushikdighe commented on Feb 20, 2018

princeprathap commented on Mar 1, 2018

tapaz1 commented on Mar 5, 2018

fengerzh commented on Mar 9, 2018

jdthorpe commented on Apr 12, 2018

Workaround:

mpilarcastillejo commented on Sep 21, 2018

alan-agius4 commented on Jan 7, 2019

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions

Bug Report or Feature Request (mark with an `x`)