构建 Angular 7 组件库失败

问题描述 投票:0回答:2

我曾经在 Angular 版本 11 中顺利创建组件库,没有任何问题,但是当我在 Angular 版本 7 中创建组件库时,在 ng 构建组件库时出现错误

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)

他要求tsickle模块,但是json包中tsickle已经存在了

我的

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"
    }
}

我也试过关掉它

"annotateForClosureCompiler": false
不被束缚/需要 tickle 但这也不起作用

我还尝试替换

@node_modules/ng-packagr/lib/ngc/create-emit-callback.js

中的 tsickle 指令

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

成为

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

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

它不起作用,而是添加到我的错误消息中

我的 7 版 Angular 应用程序到底发生了什么?为什么ng建不了组件库

我很沮丧,所有的帮助和建议,我谢谢你们

node.js angular angular-library tsickle
2个回答
4
投票

我也遇到了完全相同的问题。降级“tsickle”的版本解决了我的问题。

npm i -D [email protected]

不确定哪个版本可以工作,但上面的版本适用于 Angular v7.0.4 和 ng-packagr v4.7.1。


1
投票

对于 npm :运行

npm i --save-dev tsickle

© www.soinside.com 2019 - 2024. All rights reserved.