updating CLI from 6.1.5 -> 7.0.3 indicates missing tsconfig files for ng serve / test (Karma)

[michahell]

Bug Report or Feature Request (mark with an x)

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

Command (mark with an x)

- [ ] new
- [x] build
- [x] serve
- [x] test
- [ ] e2e
- [ ] generate
- [ ] add
- [ ] update
- [ ] lint
- [ ] xi18n
- [ ] run
- [ ] config
- [ ] help
- [ ] version
- [ ] doc

Versions

node: v9.8.0
npm: 6.4.1
ng: 7.0.3
os: macOS Mojave

Repro steps

In our Angular app we use a library consisting of only .ts files. these are mostly typings (so we should maybe use .d.ts as suffix, but without this compilation worked fine in Angular 6.1.5.
After upgrading, for 3 out of 36 .ts files we get errors looking like the one in the log section below.

After including the include property in our tsconfig.json file:

"include" : [
    "node_modules/@customTypings/**/*.ts",
    "src/main.ts",
    "src/polyfills.ts"
  ]

we get the same error for our main.ts and polyfills.ts files. After adding also these files, that fixes compilation for ng serve and ng build. For ng test (with Karma) however, we still get the same errors, even though our tsconfig.spec.json extends tsconfig.json.

Will try to come up with an MWE, WIP

The log given by the failure

ERROR in ./node_modules/@customTypings/api/lib/common.ts
Module build failed (from ./node_modules/@ngtools/webpack/src/index.js):
Error: /Users/michahell/project/node_modules/@customTypings/api/lib/common.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 (/Users/michahell/project/node_modules/@ngtools/webpack/src/packages/ngtools/webpack/src/angular_compiler_plugin.ts:1028:15)
    at plugin.done.then (/Users/michahell/project/node_modules/@ngtools/webpack/src/packages/ngtools/webpack/src/loader.ts:49:29)
    at <anonymous>
    at process._tickCallback (internal/process/next_tick.js:118:7)
 @ ./src/app/components/conversation-message/conversation-message.component.spec.ts 13:15-44
 @ ./src sync \.spec\.ts$
 @ ./src/test.ts

Desired functionality

compilation succeeds as before in 6.1.7

[alan-agius4]

@michahell what was the original error that you experienced before adding the files in the include.

The latest error that you are experiencing is legit and is working as expected as libraries should not contain any TypeScript files and has been the case even for version 6.

[michahell]

@alan-agius4
We're only seeing variations on the exact same error pointing to other .ts files, even before I added the files to include.
In version 6 we did not even get warnings regarding this and everything worked fine.
What is the way to go? Should we make everything .d.ts definitions ?

[michahell]

And should I not be allowed to do whatever I want in my libraries? Why is it prohibited to import .ts files? They should be warnings, just like the current error is a warning the user.

[filipesilva]

@michahell you certainly can do whatever you want in your libraries, but it is important to understand the implications of shipping typescript files.

When you ship typescript files in a library, and import them from application typescript code, then the build system for your application is the one that will be building the library typescript files.

Configuration might be required for that to work, especially on the tsconfig file. It's obvious enough that TS syntax that was introduced on newer versions won't work on older versions. But Typescript does not follow semver, and can introduce breaking changes in minors. So there is no real guarantee that TS syntax will be valid on upcoming versions. E.g. that what is valid under 3.0 is also valid in 3.1.

So all in all if you ship TS in a library for consumers to build, then the consumers will have to build it using the same TS version as the library is developed in. This is often reasonable enough for internal libraries.

It's definitely not prohibited to import .ts files, but of you do import them then it really is up to you to configure TS in such a way that it can actually build them. This often includes adding it to the files/include arrays.

For most of CLI 1.x we had a bug where we didn't really pay attention to the files listed in the tsconfig and just compiled all TS files that we came across. That changed in 1.5 and we started emitting *.ts is not part of the compilation errors (#8284 (comment)).

That should have been in place throughout all 6.x releases. So I'm not really sure of why you're seeing errors in 7.x but not in 6.x.

I think there is a bug somewhere, perhaps an error that is being swallowed. To figure out what's happening we'll need a reproduction, which you seem to be working on already.

[michahell]

@filipesilva Thank you for your elaborate answer, this all makes sense. our use case is indeed usage as internal library. I'll look into reproducing this now

[michahell]

Here is a reproduction of what I'm experiencing.
steps:

• I've used the Angular CLI to generate a new project using ng new
• then I added our own internal library .ts package to test if I was still experiencing this issue, which I was.
• I removed our internal library package
• created a sample package inside node_modules called @sample-ts-lib with a sample exported enum and interface.
• I use the enum from the sample package in app.component like so: const mountain = MountainEnum.meru;
• when I run both npm start and npm test I get the error mentioned above.
• I then update tsconfig.json with the following include property:

"include" : [
    "node_modules/@sample-ts-lib/**/*.ts",
    "src/main.ts",
    "src/polyfills.ts"
  ],

(side question: why do I have to explicitly include main.ts and polyfill.ts here? is it for the same reasons? but then why specify this in angular.json in the architect.build section?)

• now, I don't get compile errors with npm start. I do get compile errors with npm test.
• lastly, I tried adding "node_modules/@sample-ts-lib/**/*.ts" to the include property of tsconfig.json to no avail.

ts-lib-repro.zip