Open Closed

Couldn't build angular app #8593


User avatar
0
NH-Support created
  • ABP Framework version: v9.0.2
  • UI Type: Angular
  • Database System: EF Core (SQL Serve)
  • Auth Server Separated (for Angular): yes
  • Exception message and full stack trace: ./node_modules/ng-zorro-antd/fesm2022/ng-zorro-antd-core-color.mjs:1:0-65 - Error: Module not found: Error: Can't resolve '@ctrl/tinycolor' in 'F:\Projects\Templates\testAngular\angular\node_modules\ng-zorro-antd\fesm2022'
  • Steps to reproduce the issue: I create new project template from abp suite , after installing all angular packages I git this error when I run the angular app also when I am updating the old projects I get the same error Now old projects is stopping
Markdown supported.
Copy, paste, or drag & drop images and files (max 100 MB per file, 100 MB total per post)

11 Answer(s)
  • User Avatar
    0
    sumeyye.kurtulus created
    Support Team Angular Expert

    Hello, This issue is caused by an update in a third-party package. We're planning to fix it on our side with a patch release soon. In the meantime, you can work around it by adding the dependency manually with this command yarn add @ctrl/tinycolor

    Markdown supported.
    Copy, paste, or drag & drop images and files (max 100 MB per file, 100 MB total per post)
  • User Avatar
    0
    NH-Support created

    Hello Dear the app is building now but when I request the URL I get this error (Unexpected token { ) and this is the template project with out any additional code or packages

    Markdown supported.
    Copy, paste, or drag & drop images and files (max 100 MB per file, 100 MB total per post)
  • User Avatar
    0
    sumeyye.kurtulus created
    Support Team Angular Expert

    Hello again, I have used this command to create a project abp new TestApp -u angular -csf and I could not produce the same problem. Can you please share your steps along with your dependencies in package.json so that I can assist you further?

    Markdown supported.
    Copy, paste, or drag & drop images and files (max 100 MB per file, 100 MB total per post)
  • User Avatar
    0
    NH-Support created

    I built it using the Abp studio with commercial license also old projects now facing the same problem after upgrade the packages so I don't think it is related with how to create the app I am using Edge browser version 89.0.774.68 (64-bit)

    this is the Packages dependencies": { "@abp/ng.components": "~9.0.2", "@abp/ng.core": "~9.0.2", "@abp/ng.feature-management": "~9.0.2", "@abp/ng.oauth": "~9.0.2", "@abp/ng.setting-management": "~9.0.2", "@abp/ng.theme.shared": "~9.0.2", "@angular/animations": "~18.1.0", "@angular/common": "~18.1.0", "@angular/compiler": "~18.1.0", "@angular/core": "~18.1.0", "@angular/forms": "~18.1.0", "@angular/localize": "~18.1.0", "@angular/platform-browser": "~18.1.0", "@angular/platform-browser-dynamic": "~18.1.0", "@angular/router": "~18.1.0", "@ctrl/tinycolor": "^4.1.0", "@volo/abp.commercial.ng.ui": "~9.0.2", "@volo/abp.ng.account": "~9.0.2", "@volo/abp.ng.audit-logging": "~9.0.2", "@volo/abp.ng.chat": "~9.0.2", "@volo/abp.ng.file-management": "~9.0.2", "@volo/abp.ng.gdpr": "~9.0.2", "@volo/abp.ng.identity": "~9.0.2", "@volo/abp.ng.language-management": "~9.0.2", "@volo/abp.ng.openiddictpro": "~9.0.2", "@volo/abp.ng.saas": "~9.0.2", "@volo/abp.ng.text-template-management": "~9.0.2", "@volosoft/abp.ng.theme.lepton-x": "~4.0.3", "rxjs": "~7.8.0", "tslib": "^2.0.0", "zone.js": "~0.14.0" }, "devDependencies": { "@abp/ng.schematics": "~9.0.2", "@angular-devkit/build-angular": "~18.1.0", "@angular-eslint/builder": "~18.1.0", "@angular-eslint/eslint-plugin": "~18.1.0", "@angular-eslint/eslint-plugin-template": "~18.1.0", "@angular-eslint/schematics": "~18.1.0", "@angular-eslint/template-parser": "~18.1.0", "@angular/cli": "~18.1.0", "@angular/compiler-cli": "~18.1.0", "@angular/language-service": "~18.1.0", "@types/jasmine": "~3.6.0", "@types/node": "^20.0.0", "@typescript-eslint/eslint-plugin": "^7.0.0", "@typescript-eslint/parser": "^7.0.0", "eslint": "^8.0.0", "jasmine-core": "~4.0.0", "karma": "~6.3.0", "karma-chrome-launcher": "~3.1.0", "karma-coverage": "~2.1.0", "karma-jasmine": "~4.0.0", "karma-jasmine-html-reporter": "^1.0.0", "typescript": "~5.5.0" }

    Markdown supported.
    Copy, paste, or drag & drop images and files (max 100 MB per file, 100 MB total per post)
  • User Avatar
    0
    sumeyye.kurtulus created
    Support Team Angular Expert

    Thank you for sharing more details. I have created a project and tested with the steps that you have provided. However, I could not produce the problem.

    I may suggest you to delete node_modules and yarn.lock, and reinstall dependencies since then there would be a problem in the cache. Also, you can remove the @ctrl/tinycolor dependency because the problem is fixed within the latest patch release.

    If the problem persists, you can share a sample project via this email sumeyye.kurtulus@volosoft.com.

    Markdown supported.
    Copy, paste, or drag & drop images and files (max 100 MB per file, 100 MB total per post)
  • User Avatar
    0
    NH-Support created

    Hello dear, After searching it was a browser compatibility issue I updated the browser version to the latest version and it is working now

    Markdown supported.
    Copy, paste, or drag & drop images and files (max 100 MB per file, 100 MB total per post)
  • User Avatar
    0
    464199480 created

    Has the issue been fixed?

    Markdown supported.
    Copy, paste, or drag & drop images and files (max 100 MB per file, 100 MB total per post)
  • User Avatar
    0
    sumeyye.kurtulus created
    Support Team Angular Expert

    Has the issue been fixed?

    Hello, if you are mentioning the dependency problem caused by @ctrl/tinycolor, it is fixed by the latest patch release.

    Markdown supported.
    Copy, paste, or drag & drop images and files (max 100 MB per file, 100 MB total per post)
  • User Avatar
    0
    andmattia created

    We have same issue in old version and we fix the tinycolor

    Markdown supported.
    Copy, paste, or drag & drop images and files (max 100 MB per file, 100 MB total per post)
  • User Avatar
    0
    464199480 created

    Does it mean that we need to add @ctrl/tinycolor to package.json in future versions

    Markdown supported.
    Copy, paste, or drag & drop images and files (max 100 MB per file, 100 MB total per post)
  • User Avatar
    0
    sumeyye.kurtulus created
    Support Team Angular Expert

    Does it mean that we need to add @ctrl/tinycolor to package.json in future versions

    Hello, there should be no need to make such change since it is fixed here https://github.com/abpframework/abp/pull/21797

    Markdown supported.
    Copy, paste, or drag & drop images and files (max 100 MB per file, 100 MB total per post)
Boost Your Development
ABP Live Training
Packages
See Trainings
Mastering ABP Framework Book
The Official Guide
Mastering
ABP Framework
Learn More
Mastering ABP Framework Book
Made with ❤️ on ABP v10.8.0-preview. Updated on September 28, 2026, 11:44
1
ABP Assistant
🔐 You need to be logged in to use the chatbot. Please log in first.