angular-cli: Cannot find module "tslib"

Bug Report or Feature Request (mark with an x)

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

Area

- [ ] devkit
- [ ] schematics

Versions

Angular CLI: 6.0.8 Node: 8.11.3 OS: darwin x64 Angular: 6.0.5

Repro steps

I have got an angular library in my-app/projects/my-angular-lib. My my-app/projects/my-angular-lib/karma.conf.js is as follows:

module.exports = function (config) {
  config.set({
    basePath: './',
    frameworks: ['jasmine', '@angular-devkit/build-angular'],
    plugins: [
      require('karma-jasmine'),
      require('karma-chrome-launcher'),
      require('karma-jasmine-html-reporter'),
      require('karma-coverage-istanbul-reporter'),
      require('@angular-devkit/build-angular/plugins/karma')
    ],
    client: {
      clearContext: false // leave Jasmine Spec Runner output visible in browser
    },
    coverageIstanbulReporter: {
      dir: require('path').join(__dirname, '../../coverage'),
      reports: ['html', 'lcovonly'],
      fixWebpackSourcePaths: true
    },
    reporters: ['progress', 'kjhtml'],
    port: 9876,
    colors: true,
    logLevel: config.LOG_INFO,
    autoWatch: true,
    browsers: ['Chrome'],
    singleRun: false
  });
};

The log given by the failure

$ node_modules/.bin/ng test my-angular-lib
  0% compiling(node:7044) DeprecationWarning: Tapable.plugin is deprecated. Use new APIon `.hooks` instead
05 07 2018 17:17:46.301:WARN [karma]: No captured browser, open http://localhost:9876/
05 07 2018 17:17:46.306:INFO [karma]: Karma v1.7.1 server started at http://0.0.0.0:9876/
05 07 2018 17:17:46.306:INFO [launcher]: Launching browser Chrome with unlimited concurrency
05 07 2018 17:17:46.310:INFO [launcher]: Starting browser Chrome
05 07 2018 17:17:50.840:WARN [karma]: No captured browser, open http://localhost:9876/
05 07 2018 17:17:50.976:INFO [Chrome 67.0.3396 (Mac OS X 10.13.5)]: Connected on socketJ66OtIkcg5hfhJm_AAAA with id 49503961
Chrome 67.0.3396 (Mac OS X 10.13.5) ERROR
  Uncaught Error: Cannot find module "tslib".
  at http://localhost:9876/_karma_webpack_/main.js:150
Chrome 67.0.3396 (Mac OS X 10.13.5) ERROR
  Uncaught Error: Cannot find module "tslib".
  at http://localhost:9876/_karma_webpack_/main.js:150

Chrome 67.0.3396 (Mac OS X 10.13.5) ERROR
  Uncaught Error: Cannot find module "tslib".
  at http://localhost:9876/_karma_webpack_/main.js:150

Desired functionality

Tests should run fine.

About this issue

  • Original URL
  • State: closed
  • Created 6 years ago
  • Reactions: 7
  • Comments: 16 (1 by maintainers)

Most upvoted comments

Unknown if this is related to your bug, but for me I only get this when I include using NO_ERRORS_SCHEMA and I include it from @angular/compiler/src/core rather than from @angular/core. Any chance you have a similar import issue?

Same issue happens when importing ChangeDetectionStrategy from @angular/compiler/src/core, importing it from @angular/core fixed it.

This also shows up if you import CUSTOM_ELEMENTS_SCHEMA from @angular/compiler/src/core. Note to self: don’t always trust auto-import in VSCode.

Yup, importing ViewEncapsulation from ‘@angular/compiler/src/core’ did break it for me. Pretty annoying problem to find out, as stack trace did not hint to the right direction at all.

Thank you so much @mikyladewitt I’ve been fighting this for hours! I can verify that if you import NO_ERRORS_SCHEMA from @angular/compiler/src/core rather than from @angular/core then it errors out when running tests. I do wish it gave me more info than just saying Uncaught Error: Cannot find module "tslib". at http://localhost:9876/_karma_webpack_/main.js:155

In My case When I import from @angular/core then it worked. VSCode imported ChangeDetectionStrategy from @angular/compiler/src/core

Below is the fix for my case.

import {ChangeDetectionStrategy } from '@angular/core';

It may be. I did use NO_ERRORS_SCHEMA and imported automatically, so it may have been @angular/compiler/src/core. I then reverted all my changes so I cannot verify that, but thanks a lot.

In My case When I import from @angular/core then it worked. VSCode imported ChangeDetectionStrategy from @angular/compiler/src/core

Below is the fix for my case.

import {ChangeDetectionStrategy } from '@angular/core';

thanks @rupeshtiwari You saved my day.

This also shows up if you import CUSTOM_ELEMENTS_SCHEMA from @angular/compiler/src/core. Note to self: don’t always trust auto-import in VSCode.

Got the same problem with auto import I guess the issue is having the same name, if only there was a way to issue a warning to console when imported

I did run in cmd: npm i tslib

and used NO_ERRORS_SCHEMA @angular/core fixed it