Failed to build angular 7 component library

Question

I once created component lib in angular version 11 smoothly without any problems, but when I created component lib in angular version 7, I got an error when ng build component lib

Cannot find module 'tsickle/src/tsickle'
Require stack:
- D:\Angular7\CSS\node_modules\ng-packagr\lib\ngc\create-emit-callback.js
- D:\Angular7\CSS\node_modules\ng-packagr\lib\ngc\compile-source-files.js
- D:\Angular7\CSS\node_modules\ng-packagr\lib\ng-v5\entry-point\ts\compile-ngc.transform.js
- D:\Angular7\CSS\node_modules\ng-packagr\lib\ng-v5\entry-point\ts\compile-ngc.di.js
- D:\Angular7\CSS\node_modules\ng-packagr\lib\ng-v5\entry-point.di.js
- D:\Angular7\CSS\node_modules\ng-packagr\lib\ng-v5\packagr.js
- D:\Angular7\CSS\node_modules\ng-packagr\lib\commands\build.command.js
- D:\Angular7\CSS\node_modules\ng-packagr\public_api.js
- D:\Angular7\CSS\node_modules\@angular-devkit\build-ng-packagr\src\build\index.js
- D:\Angular7\CSS\node_modules\@angular-devkit\architect\src\architect-legacy.js
- D:\Angular7\CSS\node_modules\@angular-devkit\architect\src\index.js
- D:\Angular7\CSS\node_modules\@angular\cli\models\architect-command.js
- D:\Angular7\CSS\node_modules\@angular\cli\commands\build-impl.js
- D:\Angular7\CSS\node_modules\@angular-devkit\schematics\tools\export-ref.js
- D:\Angular7\CSS\node_modules\@angular-devkit\schematics\tools\index.js
- D:\Angular7\CSS\node_modules\@angular\cli\utilities\json-schema.js
- D:\Angular7\CSS\node_modules\@angular\cli\models\command-runner.js
- D:\Angular7\CSS\node_modules\@angular\cli\lib\cli\index.js
- C:\Users\SuperAdmin\AppData\Roaming\npm\node_modules\@angular\cli\lib\init.js
- C:\Users\SuperAdmin\AppData\Roaming\npm\node_modules\@angular\cli\bin\ng
Error: Cannot find module 'tsickle/src/tsickle'
Require stack:
- D:\Angular7\CSS\node_modules\ng-packagr\lib\ngc\create-emit-callback.js
- D:\Angular7\CSS\node_modules\ng-packagr\lib\ngc\compile-source-files.js
- D:\Angular7\CSS\node_modules\ng-packagr\lib\ng-v5\entry-point\ts\compile-ngc.transform.js
- D:\Angular7\CSS\node_modules\ng-packagr\lib\ng-v5\entry-point\ts\compile-ngc.di.js
- D:\Angular7\CSS\node_modules\ng-packagr\lib\ng-v5\entry-point.di.js
- D:\Angular7\CSS\node_modules\ng-packagr\lib\ng-v5\packagr.js
- D:\Angular7\CSS\node_modules\ng-packagr\lib\commands\build.command.js
- D:\Angular7\CSS\node_modules\ng-packagr\public_api.js
- D:\Angular7\CSS\node_modules\@angular-devkit\build-ng-packagr\src\build\index.js
- D:\Angular7\CSS\node_modules\@angular-devkit\architect\src\architect-legacy.js
- D:\Angular7\CSS\node_modules\@angular-devkit\architect\src\index.js
- D:\Angular7\CSS\node_modules\@angular\cli\models\architect-command.js
- D:\Angular7\CSS\node_modules\@angular\cli\commands\build-impl.js
- D:\Angular7\CSS\node_modules\@angular-devkit\schematics\tools\export-ref.js
- D:\Angular7\CSS\node_modules\@angular-devkit\schematics\tools\index.js
- D:\Angular7\CSS\node_modules\@angular\cli\utilities\json-schema.js
- D:\Angular7\CSS\node_modules\@angular\cli\models\command-runner.js
- D:\Angular7\CSS\node_modules\@angular\cli\lib\cli\index.js
- C:\Users\SuperAdmin\AppData\Roaming\npm\node_modules\@angular\cli\lib\init.js
- C:\Users\SuperAdmin\AppData\Roaming\npm\node_modules\@angular\cli\bin\ng
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:880:15)
    at Function.Module._load (internal/modules/cjs/loader.js:725:27)
    at Module.require (internal/modules/cjs/loader.js:952:19)
    at require (internal/modules/cjs/helpers.js:88:18)
    at Object.<anonymous> (D:\Angular7\CSS\node_modules\ng-packagr\lib\ngc\create-emit-callback.js:15:17)
    at Module._compile (internal/modules/cjs/loader.js:1063:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10)
    at Module.load (internal/modules/cjs/loader.js:928:32)
    at Function.Module._load (internal/modules/cjs/loader.js:769:14)
    at Module.require (internal/modules/cjs/loader.js:952:19)
    at require (internal/modules/cjs/helpers.js:88:18)
    at Object.<anonymous> (D:\Angular7\CSS\node_modules\ng-packagr\lib\ngc\compile-source-files.js:13:32)
    at Module._compile (internal/modules/cjs/loader.js:1063:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10)
    at Module.load (internal/modules/cjs/loader.js:928:32)
    at Function.Module._load (internal/modules/cjs/loader.js:769:14)

He asked for the tsickle module, but in the json package tsickle already exists

my package.json

{
    "name": "CSS",
    "version": "0.0.0",
    "scripts": {
        "ng": "ng",
        "start": "ng serve",
        "build": "ng build",
        "test": "ng test",
        "lint": "ng lint",
        "e2e": "ng e2e",
        "buildSimple": "ng build Simple"
    },
    "private": true,
    "dependencies": {
        "@angular/animations": "~7.2.0",
        "@angular/common": "~7.2.0",
        "@angular/compiler": "~7.2.0",
        "@angular/core": "~7.2.0",
        "@angular/forms": "~7.2.0",
        "@angular/platform-browser": "~7.2.0",
        "@angular/platform-browser-dynamic": "~7.2.0",
        "@angular/router": "~7.2.0",
        "core-js": "^2.5.4",
        "rxjs": "~6.3.3",
        "tslib": "^1.9.0",
        "zone.js": "~0.8.26"
    },
    "devDependencies": {
        "@angular-devkit/build-angular": "~0.13.0",
        "@angular-devkit/build-ng-packagr": "~0.13.0",
        "@angular/cli": "~7.3.10",
        "@angular/compiler-cli": "~7.2.0",
        "@angular/language-service": "~7.2.0",
        "@types/node": "~8.9.4",
        "@types/jasmine": "~2.8.8",
        "@types/jasminewd2": "~2.0.3",
        "codelyzer": "~4.5.0",
        "jasmine-core": "~2.99.1",
        "jasmine-spec-reporter": "~4.2.1",
        "karma": "~4.0.0",
        "karma-chrome-launcher": "~2.2.0",
        "karma-coverage-istanbul-reporter": "~2.0.1",
        "karma-jasmine": "~1.1.2",
        "karma-jasmine-html-reporter": "^0.2.2",
        "ng-packagr": "^4.2.0",
        "protractor": "~5.4.0",
        "ts-node": "~7.0.0",
        "tsickle": ">=0.35.0",
        "tslib": "^1.9.0",
        "tslint": "~5.11.0",
        "typescript": "~3.2.2"
    }
}

I've also tried turning it off "annotateForClosureCompiler": false to not be bound/need tsickle but that also doesn't work

I've also tried Replacing the tsickle directive which is in @node_modules/ng-packagr/lib/ngc/create-emit-callback.js

const tsickle = require("tsickle/src/tsickle");

to be

const tsickle = require("tsickle/build/src/tsickle");

or

const tsickle = require("../../../tsickle/out/src/tsickle");

it doesn't work instead it adds to my error message

what actually happened to my version 7 angular app? why can't ng build component library

I'm quite frustrated, all the help and suggestions for help, I thank you

Answer 1

For npm :run npm i --save-dev tsickle

Answer 2

I had the exact same issue. Downgrading the version of "tsickle" fixed the problem for me.

npm -i -D [email protected]

Not sure which exact versions would work, but the above worked with Angular v7.0.4 and ng-packagr v4.7.1.