Bad absolute paths in TS auto imports due to new baseUrl
See original GitHub issue- [X] bug report
Versions.
cli 1.0.0 (since rc.2) typescript 2.2.2 (which is installed by default by the cli)
Repro steps.
typescript 2.2 introduced quickfixes for auto importing missing classes (in VS Code, a class not imported will be underlined in red, you can click on it, then on the bulb, and it would add the import).
with angular-cli rc.1, it would generate relative imports (the default behavior) :
import { SomeService } from './some.service';
since angular-cli rc.2, as a "baseUrl": "src"
has been introduced in the root tsconfig.json, the auto imports are now generated with absolute paths :
import { SomeService } from 'app/feature/some.service';
And, unless I’m wrong, it’s bad practice (in particular for refactoring).
@intellix says in #5353 baseUrl
was introduced because :
When you’re in VSC and write code like: import { environment } from ‘environments/environment’, it’s flagged as being incorrect because the IDE doesn’t know about tsconfig.app.json
But the CLI doesn’t generate that, it generates this in main.ts
:
import { environment } from './environments/environment';
which is the convention and which works perfectly fine, without baseUrl
.
So except I’m missing something, this change should be reversed (I can do the PR if it’s OK).
Issue Analytics
- State:
- Created 6 years ago
- Comments:14 (11 by maintainers)
Is there currently a solution for using absolute paths? In version
1.3.1
of the cli the"baseUrl": "src"
doesn’t work for using absolute paths likeimport { ThingComponent } from 'app/thing/thing.component'
, whereas it did work in previous verion(s).Absolute paths are really nice for refactoring when moving components or services around because the path to a module is the same no matter where in the app it is being used.
I can’t tell from this discussion or from the related issues and PRs whether or not there is a way to accomplish this still.
If there isn’t and it’s not going to be a support feature that’s ok, I’d just like to know.
Update–
If you set the root
tsconfig.json
"baseUrl": "src",
and thetsconfig.app.json
"baseUrl": ".",
then both dev and AoT builds work.For anyone wanting to get rid of unwieldy long relative paths my solution was to add alias paths in root tsconfig.json
then the imports would look like:
import { UserService } from 'app-services/user.service';
import { User } from 'app-models/user';