ng serve failed: "Cannot find module ... " for all imports starting with "src/"

See original GitHub issue

🐞 Bug report

Command (mark with an x)

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

Is this a regression?

I am not sure. Up until I ran npm insatll to update some other dependencies other than angular ones, I did not encounter any problem.

Description

The project was running successfully until I ran npm install to update a few dependencies and resolve some vulnerabilities. Then the project just broke and told me that all the imports starting with src/ failed.

πŸ”¬ Minimal Reproduction

I have a tutorial project here. You may just clone it and run ng serve.

πŸ”₯ Exception or Error


ERROR in src/app/_services/event.service.ts(6,29): error TS2307: Cannot find module 'src/environments/environment'.
src/app/_services/voter.service.ts(4,29): error TS2307: Cannot find module 'src/environments/environment'.
src/app/events/event-card/event-card.component.ts(2,23): error TS2307: Cannot find module 'src/app/_models/event'.
src/app/events/event-detail/event-detail.component.ts(2,30): error TS2307: Cannot find module 'src/app/_services/event.service'.
src/app/events/event-detail/event-detail.component.ts(4,23): error TS2307: Cannot find module 'src/app/_models/event'.
src/app/events/event-detail/event-detail.component.ts(5,25): error TS2307: Cannot find module 'src/app/_models/session'.
src/app/events/event-list/event-list.component.ts(4,23): error TS2307: Cannot find module 'src/app/_models/event'.
src/app/events/event-new/event-new.component.ts(3,30): error TS2307: Cannot find module 'src/app/_services/event.service'.
src/app/events/event-new/event-new.component.ts(5,23): error TS2307: Cannot find module 'src/app/_models/event'.
src/app/events/event-new/event-new.component.ts(6,40): error TS2307: Cannot find module 'src/app/_validators/location-or-url.validators'.
src/app/events/event-new/event-new.component.ts(7,31): error TS2307: Cannot find module 'src/app/_validators/date.validators'.
src/app/events/event-session-new/event-session-new.component.ts(7,33): error TS2307: Cannot find module 'src/app/_validators/restricted-words.validator'.
src/app/events/event-session-new/event-session-new.component.ts(8,25): error TS2307: Cannot find module 'src/app/_models/session'.
src/app/events/event-session/event-session.component.ts(2,25): error TS2307: Cannot find module 'src/app/_models/session'.
src/app/events/event-session/event-session.component.ts(4,29): error TS2307: Cannot find module 'src/app/_services/auth.service'.
src/app/events/event-session/event-session.component.ts(5,30): error TS2307: Cannot find module 'src/app/_services/voter.service'.
src/app/user/login/login.component.ts(2,29): error TS2307: Cannot find module 'src/app/_services/auth.service'.
src/app/user/login/login.component.ts(4,29): error TS2307: Cannot find module 'src/app/_services/noty.service'.
src/app/user/profile/profile.component.ts(3,29): error TS2307: Cannot find module 'src/app/_services/auth.service'.
src/app/user/profile/profile.component.ts(5,29): error TS2307: Cannot find module 'src/app/_services/noty.service'.

🌍 Your Environment


     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / β–³ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/
    

Angular CLI: 7.1.0
Node: 10.14.2
OS: win32 x64
Angular: 7.1.1
... animations, common, compiler, core, forms, language-service
... platform-browser, platform-browser-dynamic, router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.11.0
@angular-devkit/build-angular     0.12.3
@angular-devkit/build-optimizer   0.12.3
@angular-devkit/build-webpack     0.12.3
@angular-devkit/core              7.1.0
@angular-devkit/schematics        7.1.0
@angular/cli                      7.1.0
@angular/compiler-cli             7.1.4
@ngtools/webpack                  7.2.3
@schematics/angular               7.1.0
@schematics/update                0.11.0
rxjs                              6.3.3
typescript                        3.1.6
webpack                           4.28.4

Anything else relevant? I tried to resolve the issue by fixing the version mismatch between @angular/compiler and @angular/compiler-cli as it was prompted after the npm install, saying that npm WARN @angular/compiler-cli@7.1.4 requires a peer of @angular/compiler@7.1.4 but none is installed. You must install peer dependencies yourself. Not helping at all, if not making things worse…

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Comments:6

github_iconTop GitHub Comments

8reactions
talohanacommented, May 13, 2019

What caused my problem is { "compilerOptions": { "baseUrl": "./"}} being set in the tsconfig.app.json file which is inside the src folder.
Removing it or specifying it to the parent folder fixed it.

1reaction
alan-agius4commented, Mar 11, 2019

Hi, looking at your code base, this is working as intended.

As imports to local modules need to be relative to the file that is importing them example in https://github.com/HymanZHAN/EventBoard/blob/052f175dc5ec51643627aeb22a6d156fe891b53b/src/app/_services/event.service.ts#L6 and not absolute.

import { environment } from 'src/environments/environment';

Should be

import { environment } from '../../environments/environment';
Read more comments on GitHub >

github_iconTop Results From Across the Web

Cannot find module '@angular/compiler-cli' with ng serve
An unhandled exception occurred: Cannot find module '@angular/compiler-cli' Require stack: - D:\PMSAngularProj\node_modules\@ngtools\webpack\srcΒ ...
Read more >
Cannot find module '@angular-devkit/build-angular ... - YouTube
An unhandled exception occurred: Cannot find module '@angular-devkit/build-angular/package.json'The above exception while running an angularΒ ...
Read more >
'Cannot find module' error on imports after Angular 9 migration
WebStorm underlines imports path and shows error 'Cannot find module' when path is derived from root (e.g. app/src/components/comp. component)Β ...
Read more >
cannot find module [Node npm Error Solved] - freeCodeCamp
Why the "Error: cannot find module" Occurs Β· you're trying to import an item from a module you don't have installed in your...
Read more >
cannot find module 'process' or its corresponding type ...
3 import express from "express" src/index.ts:4:30 - error TS2307: Cannot find module 'apollo-server-express' or its corresponding type declarations.
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found