You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Angular执行ng serve报错:无法在字符串创建'message'属性求助

问题描述

Node版本:16.16.0
执行ng serve时触发如下构建错误:

/node_modules/ngx-print/fesm2020/ngx-print.mjs - Error: Module build failed (from ./node_modules/@angular-devkit/build-angular/src/babel/webpack-loader.js):
TypeError: Cannot create property 'message' on string 'C:\Users\TRANS23-LAP-RA1\Documents\GitHub\NYMTC-Angular\nymtc-web\node_modules\ngx-print\fesm2020\ngx-print.mjs: This application depends upon a library published using Angular version 15.0.4, which requires Angular version 14.0.0 or newer to work correctly.
Consider upgrading your application to use a more recent version of Angular.
162 | }
163 | NgxPrintDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: NgxPrintDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
164 | NgxPrintDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: NgxPrintDirective, selector: "button[ngxPrint]", inputs: { previewOnly: "previewOnly", printSectionId: "printSectionId", printTitle: "printTitle", useExistingCss: "useExistingCss", printDelay: "printDelay", printStyle: "printStyle", styleSheetFile: "styleSheetFile" }, host: { listeners: { "click": "print()" } }, ngImport: i0 });
167 | args: [{'
at run (C:\Users\TRANS23-LAP-RA1\Documents\GitHub\NYMTC-Angular\nymtc-web\node_modules@babel\core\lib\transformation\index.js:27:15)
at transform.next ()
at async.call.result.err.err (C:\Users\TRANS23-LAP-RA1\Documents\GitHub\NYMTC-Angular\nymtc-web\node_modules\gensync\index.js:223:11)
at C:\Users\TRANS23-LAP-RA1\Documents\GitHub\NYMTC-Angular\nymtc-web\node_modules\gensync\index.js:37:40
93 static ɵdir: i0.ɵɵDirectiveDeclaration<NgxPrintDirective, "button[ngxPrint]", never, { "previewOnly": "previewOnly"; "printSectionId": "printSectionId"; "printTitle": "printTitle"; "useExistingCss": "useExistingCss"; "printDelay": "printDelay"; "printStyle": "printStyle"; "styleSheetFile": "styleSheetFile"; }, {}, never, never, false, never>;

已尝试升级/降级相关版本,但问题未解决,寻求可行解决方案。

解决方案

1. 确认当前项目Angular版本

先执行命令查看项目实际使用的Angular核心版本,确保满足ngx-print的最低要求(14.0.0+):

ng version

若@angular/core版本低于14,必须升级项目到Angular14及以上版本。

2. 匹配ngx-print与Angular版本

若不想升级Angular到15,可安装与当前项目版本兼容的ngx-print版本:

  • Angular 12/13:安装ngx-print@1.2.1或更早版本
  • Angular 14:安装ngx-print@1.3.x版本
  • Angular 15+:安装最新版ngx-print

以Angular14为例,执行以下命令调整版本:

npm uninstall ngx-print
npm install ngx-print@1.3.1 --save

3. 清理缓存并重新构建

版本调整后,清理缓存并重新安装依赖:

npm cache clean --force
# Windows系统执行:rmdir /s /q node_modules && del package-lock.json
# 非Windows系统执行:rm -rf node_modules package-lock.json
npm install
ng serve --clean

4. 排查babel配置冲突

检查项目中是否存在自定义babel配置文件(如.babelrc、babel.config.json),这类文件可能与Angular内置构建配置冲突。临时重命名配置文件后,重新执行ng serve验证是否解决问题。

5. 验证Node版本兼容性

虽然Node16.16.0兼容Angular14/15,但检查package.json中的engines字段是否限制了Node版本,若有冲突可执行以下命令忽略限制:

npm install --force

内容的提问来源于stack exchange,提问作者Madhavi R

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.25 05:47:37