angulartypescripttuitaiga

Taiga UI v3 > v4 migration build issues


I did migration from Taiga UI v3 to v4, added some packages (with yarn), updated the code accordingly, resolved all other errors after running the (angular) project, but there is still this error which I don't understand:

...
Build at: 2025-04-22T14:47:34.441Z - Hash: fe6fe04f860facf1 - Time: 2234ms

./node_modules/@taiga-ui/kit/fesm2022/taiga-ui-kit-components-input-number.mjs:209:37-68 - Error: export 'maskitoInitialCalibrationPlugin' (imported as 'maskitoInitialCalibrationPlugin') was not found in '@maskito/core' (possible exports: MASKITO_DEFAULT_ELEMENT_PREDICATE, MASKITO_DEFAULT_OPTIONS, Maskito, maskitoPipe, maskitoTransform)

./node_modules/@taiga-ui/kit/fesm2022/taiga-ui-kit-components-input-phone-international.mjs:245:122-153 - Error: export 'maskitoInitialCalibrationPlugin' (imported as 'maskitoInitialCalibrationPlugin') was not found in '@maskito/core' (possible exports: MASKITO_DEFAULT_ELEMENT_PREDICATE, MASKITO_DEFAULT_OPTIONS, Maskito, maskitoPipe, maskitoTransform)

./node_modules/@taiga-ui/legacy/fesm2022/taiga-ui-legacy-components-input-date-time.mjs:372:34-63 - Error: export 'maskitoSelectionChangeHandler' (imported as 'maskitoSelectionChangeHandler') was not found in '@maskito/kit' (possible exports: maskitoAddOnFocusPlugin, maskitoCaretGuard, maskitoDateOptionsGenerator, maskitoDateRangeOptionsGenerator, maskitoDateTimeOptionsGenerator, maskitoEventHandler, maskitoNumberOptionsGenerator, maskitoParseNumber, maskitoPostfixPostprocessorGenerator, maskitoPrefixPostprocessorGenerator, maskitoRejectEvent, maskitoRemoveOnBlurPlugin, maskitoTimeOptionsGenerator, maskitoWithPlaceholder)

./node_modules/@taiga-ui/legacy/fesm2022/taiga-ui-legacy-components-input-number.mjs:314:37-68 - Error: export 'maskitoInitialCalibrationPlugin' (imported as 'maskitoInitialCalibrationPlugin') was not found in '@maskito/core' (possible exports: MASKITO_DEFAULT_ELEMENT_PREDICATE, MASKITO_DEFAULT_OPTIONS, Maskito, maskitoPipe, maskitoTransform)

./node_modules/@taiga-ui/legacy/fesm2022/taiga-ui-legacy-components-input-time.mjs:413:34-63 - Error: export 'maskitoSelectionChangeHandler' (imported as 'maskitoSelectionChangeHandler') was not found in '@maskito/kit' (possible exports: maskitoAddOnFocusPlugin, maskitoCaretGuard, maskitoDateOptionsGenerator, maskitoDateRangeOptionsGenerator, maskitoDateTimeOptionsGenerator, maskitoEventHandler, maskitoNumberOptionsGenerator, maskitoParseNumber, maskitoPostfixPostprocessorGenerator, maskitoPrefixPostprocessorGenerator, maskitoRejectEvent, maskitoRemoveOnBlurPlugin, maskitoTimeOptionsGenerator, maskitoWithPlaceholder)


āœ– Failed to compile.

Some packages were missing in node_modules, so I added them each manually, and now these are the only remaining errors. What can I do with it?

Here is how package.json dependencies look like right now:

"dependencies": {
    "@angular-builders/custom-webpack": "18.0.0",
    "@angular/animations": "18.2.9",
    "@angular/cdk": "18.2.9",
    "@angular/common": "18.2.9",
    "@angular/compiler": "18.2.9",
    "@angular/core": "18.2.9",
    "@angular/forms": "18.2.9",
    "@angular/platform-browser": "18.2.9",
    "@angular/platform-browser-dynamic": "18.2.9",
    "@angular/router": "18.2.9",
    "@auth0/auth0-angular": "2.2.3",
    "@aws-sdk/client-s3": "3.627.0",
    "@aws-sdk/lib-storage": "3.627.0",
    "@aws-sdk/s3-request-presigner": "3.627.0",
    "@bigchaindb/wallet-hd": "0.4.3",
    "@bigchaindb/wallet-plugins": "0.4.5",
    "@jenniferplusplus/opentelemetry-instrumentation-bullmq": "0.5.0",
    "@maskito/angular": "1.9.0",
    "@maskito/core": "1.9.0",
    "@maskito/kit": "1.9.0",
    "@maskito/phone": "3.7.1",
    "@nestjs/axios": "3.1.3",
    "@nestjs/bullmq": "10.2.3",
    "@nestjs/cache-manager": "2.3.0",
    "@nestjs/common": "10.4.15",
    "@nestjs/config": "3.3.0",
    "@nestjs/core": "10.4.15",
    "@nestjs/event-emitter": "2.1.1",
    "@nestjs/microservices": "10.4.15",
    "@nestjs/passport": "10.0.3",
    "@nestjs/platform-express": "10.4.15",
    "@nestjs/schedule": "3.0.3",
    "@nestjs/swagger": "7.2.0",
    "@nestjs/terminus": "10.2.3",
    "@nestjs/throttler": "4.2.1",
    "@nestjs/typeorm": "10.0.2",
    "@ng-web-apis/common": "4.12.0",
    "@ng-web-apis/intersection-observer": "4.12.0",
    "@ng-web-apis/mutation-observer": "4.12.0",
    "@ng-web-apis/platform": "4.12.0",
    "@ng-web-apis/resize-observer": "4.12.0",
    "@ng-web-apis/screen-orientation": "4.12.0",
    "@ngneat/tailwind": "7.0.3",
    "@ngneat/transloco": "4.3.0",
    "@ngneat/transloco-keys-manager": "3.8.0",
    "@ngneat/transloco-locale": "4.1.0",
    "@ngneat/transloco-persist-lang": "4.0.0",
    "@ngneat/transloco-validator": "3.0.1",
    "@opentelemetry/api": "1.7.0",
    "@opentelemetry/exporter-trace-otlp-grpc": "0.47.0",
    "@opentelemetry/instrumentation-amqplib": "0.33.5",
    "@opentelemetry/instrumentation-aws-sdk": "0.37.2",
    "@opentelemetry/instrumentation-dns": "0.32.5",
    "@opentelemetry/instrumentation-express": "0.34.1",
    "@opentelemetry/instrumentation-generic-pool": "0.32.5",
    "@opentelemetry/instrumentation-http": "0.47.0",
    "@opentelemetry/instrumentation-ioredis": "0.36.1",
    "@opentelemetry/instrumentation-nestjs-core": "0.33.4",
    "@opentelemetry/instrumentation-net": "0.32.5",
    "@opentelemetry/instrumentation-pg": "0.37.2",
    "@opentelemetry/instrumentation-pino": "0.34.5",
    "@opentelemetry/resources": "1.20.0",
    "@opentelemetry/sdk-node": "0.47.0",
    "@opentelemetry/sdk-trace-base": "1.20.0",
    "@opentelemetry/semantic-conventions": "1.20.0",
    "@rx-angular/cdk": "16.0.0",
    "@rx-angular/state": "16.0.0",
    "@rx-angular/template": "16.0.1",
    "@s1seven/cluster-service": "0.15.5",
    "@s1seven/custom-schema-tools-certificate-summary": "0.2.0",
    "@s1seven/custom-schema-tools-extract-emails": "0.1.1",
    "@s1seven/custom-schema-tools-generate-tkr-pdf-template": "0.2.0",
    "@s1seven/custom-schema-tools-types": "0.1.1",
    "@s1seven/nestjs-tools-access-control": "0.1.15",
    "@s1seven/nestjs-tools-amqp-transport": "0.5.1",
    "@s1seven/nestjs-tools-async-local-storage": "0.2.2",
    "@s1seven/nestjs-tools-file-storage": "0.8.0",
    "@s1seven/nestjs-tools-lock": "0.7.0",
    "@s1seven/pino-heroku-pipeline": "0.1.1",
    "@s1seven/schema-tools-validate": "0.3.16",
    "@sendgrid/eventwebhook": "8.0.0",
    "@sendgrid/mail": "8.1.4",
    "@sentry/angular": "7.118.0",
    "@sentry/integrations": "7.118.0",
    "@sentry/node": "7.118.0",
    "@sentry/opentelemetry": "7.118.0",
    "@sentry/profiling-node": "7.118.0",
    "@sentry/types": "7.118.0",
    "@splitbee/web": "0.3.0",
    "@taiga-ui/cdk": "4.32.0",
    "@taiga-ui/core": "4.32.0",
    "@taiga-ui/event-plugins": "4.5.1",
    "@taiga-ui/i18n": "4.32.0",
    "@taiga-ui/icons": "4.32.0",
    "@taiga-ui/kit": "4.32.0",
    "@taiga-ui/layout": "4.32.0",
    "@taiga-ui/legacy": "4.32.0",
    "@taiga-ui/polymorpheus": "4.9.0",
    "@taiga-ui/styles": "4.32.0",
    "@tinkoff/ng-dompurify": "4.0.0",
    "@tinkoff/ng-polymorpheus": "4.3.0",
    "ajv": "8.16.0",
    "ajv-formats": "3.0.1",
    "amqp-connection-manager": "4.1.14",
    "amqplib": "0.10.3",
    "auth0": "4.13.0",
    "axios": "1.7.9",
    "axios-retry": "4.5.0",
    "bigchaindb-driver": "4.3.0",
    "body-parser": "1.20.2",
    "bs58": "5.0.0",
    "bullmq": "4.8.0",
    "cache-manager": "5.3.2",
    "cache-manager-ioredis-yet": "1.2.2",
    "chalk": "4.1.2",
    "class-transformer": "0.5.1",
    "class-validator": "0.14.1",
    "cookie-parser": "1.4.7",
    "country-code-lookup": "0.1.1",
    "date-fns": "2.30.0",
    "dotenv": "16.3.2",
    "dotenv-expand": "10.0.0",
    "express": "4.19.2",
    "express-rate-limit": "7.4.1",
    "handlebars": "4.7.8",
    "helmet": "8.0.0",
    "hyperid": "3.1.1",
    "ioredis": "5.3.2",
    "json-stable-stringify": "1.1.1",
    "jwks-rsa": "3.1.0",
    "lato-font": "3.0.0",
    "lodash": "4.17.21",
    "lodash.clonedeepwith": "4.5.0",
    "loopbench": "2.0.0",
    "lru-cache": "10.1.0",
    "mime": "3.0.0",
    "minimatch": "9.0.3",
    "mqtt": "5.3.6",
    "nestjs-asyncapi": "1.2.1",
    "nestjs-pino": "4.0.0",
    "nestjs-throttler-storage-redis": "0.4.1",
    "nestjs-typeorm-paginate": "4.0.4",
    "node-cache": "5.1.2",
    "otpauth": "9.2.2",
    "papaparse": "5.4.1",
    "passport": "0.7.0",
    "passport-jwt": "4.0.1",
    "pg": "8.11.3",
    "pg-query-stream": "4.5.3",
    "pino": "8.17.2",
    "pino-datadog-transport": "1.3.2",
    "pino-http": "9.0.0",
    "pino-pretty": "10.3.1",
    "qrcode": "1.5.3",
    "query-string": "7.1.3",
    "reflect-metadata": "0.2.1",
    "rxjs": "7.8.1",
    "semver": "7.5.4",
    "semver-lite": "0.0.6",
    "swagger-ui-express": "5.0.0",
    "tar": "6.2.1",
    "ts-mixer": "6.0.4",
    "tslib": "2.6.2",
    "tweetnacl-util": "0.15.1",
    "typeorm": "0.3.19",
    "typeorm-encrypted": "0.8.0",
    "zone.js": "0.14.10"
  },

Solution

  • I can see that maskitoChangeEventPlugin is already a part of @tiaga/core, so the problem might be a caching issue or installation issue.

    1. First delete node_modules and package-lock.json.
    2. Then delete the .angular folder.
    3. Do a fresh install and check if the issue is resolved.

    If not, you need to uninstall Tiaga components and reinstall them, as this can also be caused by a version mismatch between the Tiaga components.

    projects/core/src/index.ts#L8

    export {
        MASKITO_DEFAULT_ELEMENT_PREDICATE,
        MASKITO_DEFAULT_OPTIONS,
    } from './lib/constants';
    export {Maskito} from './lib/mask';
    export {
        maskitoChangeEventPlugin,
        maskitoInitialCalibrationPlugin,
        maskitoStrictCompositionPlugin,
    } from './lib/plugins';
    export type {
        MaskitoElement,
        MaskitoElementPredicate,
        MaskitoMask,
        MaskitoMaskExpression,
        MaskitoOptions,
        MaskitoPlugin,
        MaskitoPostprocessor,
        MaskitoPreprocessor,
    } from './lib/types';
    export {
        maskitoAdaptContentEditable,
        maskitoPipe,
        maskitoTransform,
        maskitoUpdateElement,
    } from './lib/utils';