NX Angular Jest: "SyntaxError: Unexpected token 'export'"

122 Views Asked by At

I have an internal NPM package I am importing for my NX Monorepo for work. While trying to run my unit tests I am getting errors pointing to that package whenever I have a 'spec.ts' file with an import from that NPM package. I have been looking around all over and I think I need to use the 'transformIgnorePatterns' in my 'jest.preset.js' file but it does not seem to be working.

Here is my jest.preset.js file: ` const nxPreset = require('@nx/jest/preset').default;

module.exports = {
   ...nxPreset,

  moduleFileExtensions: ['ts', 'js', 'html'],
  resolver: '@nx/jest/plugins/resolver',
  coverageReporters: ['html'],
  transform: {
    '^.+\\.(ts|mjs|js|html)$': ['jest-preset-angular', {
      tsconfig: '<rootDir>/tsconfig.spec.json',
      stringifyContentPathRegex: '\\.(html|svg)$',
      astTransformers: [
        'jest-preset-angular/build/InlineFilesTransformer',
        'jest-preset-angular/build/StripStylesTransformer'
      ]
    }]
  },
  transformIgnorePatterns: ['node_modules/(?!.*.mjs$|lodash-es)', '<rootDir>/node_modules/@a360'],
  snapshotSerializers: [
    'jest-preset-angular/build/serializers/no-ng-attributes',
    'jest-preset-angular/build/serializers/ng-snapshot',
    'jest-preset-angular/build/serializers/html-comment'
  ],
  setupFilesAfterEnv: ['<rootDir>/src/test-setup.ts']
};

`

Here is my jest.config.ts file ` /* eslint-disable @typescript-eslint/naming-convention, @typescript-eslint/no-var-requires */ const { getJestProjects } = require('@nx/jest');

module.exports = {
  projects: [
    ...getJestProjects(),
    '<rootDir>/libs/core/components/header',
    '<rootDir>/libs/core/components/table',
    '<rootDir>/libs/core/shared',
    '<rootDir>/apps/login/',
    '<rootDir>/apps/system-settings',
    '<rootDir>/apps/ui-showcase',
  ]
};

`

Here is my package.json

    {
      "name": "@aex/source",
      "version": "0.0.0",
      "license": "MIT",
      "scripts": {
        "ng": "ng",
        "nx": "nx",
        "affected": "nx affected",
        "affected:apps": "nx affected:apps",
        "affected:build": "nx affected:build",
        "affected:dep-graph": "nx affected:dep-graph",
        "affected:libs": "nx affected:libs",
        "affected:lint": "nx affected:lint",
        "affected:test": "nx affected -t test",
        "build": "nx build",
        "build:development": "nx run-many --target=build --all --configuration development --parallel=5",
        "build:production": "nx run-many --target=build --all --configuration production --parallel=5",
        "dep-graph": "nx dep-graph",
        "format": "nx format:write",
        "format:check": "nx format:check",
        "format:write": "nx format:write",
        "lint:all": "nx run-many --target=lint",
        "start": "nx serve",
        "test:all": "nx run-many --target=test",
        "test:login": "nx test login --configuration development",
        "test:ui-showcase": "nx test ui-showcase --configuration development",
        "test:system-settings": "nx test system-settings --configuration development",
        "update": "nx migrate latest",
        "workspace-schematic": "nx workspace-schematic",
        "start:all": "nx run-many --target=serve --configuration development --parallel=5 --proxy-config proxies/proxy-devbox.config.json",
        "start:ui-showcase": "nx serve ui-showcase --configuration development --proxy-config proxies/proxy-devbox.config.json",
        "start:system-settings": "nx serve system-settings --configuration development --proxy-config proxies/proxy-devbox.config.json",
        "start:login": "nx serve login --configuration development --proxy-config proxies/proxy-devbox.config.json",
        "prepare": "husky install"
      },
      "private": true,
      "dependencies": {
        "@a360/ui": "^16.4.0-beta15",
        "@angular/animations": "~16.2.0",
        "@angular/common": "~16.2.0",
        "@angular/compiler": "~16.2.0",
        "@angular/core": "~16.2.0",
        "@angular/forms": "~16.2.0",
        "@angular/platform-browser": "~16.2.0",
        "@angular/platform-browser-dynamic": "~16.2.0",
        "@angular/router": "~16.2.0",
        "@nx/angular": "16.10.0",
        "ag-grid-angular": "^30.1.0",
        "ag-grid-community": "^30.1.0",
        "lodash": "^4.17.21",
        "ngx-cookie-service": "~16.0.0",
        "primeflex": "^2.0.0",
        "primeicons": "^6.0.1",
        "primeng": "^16.4.0",
        "rxjs": "~7.8.0",
        "tslib": "^2.3.0",
        "zone.js": "~0.13.0"
      },
      "devDependencies": {
        "@angular-devkit/build-angular": "~16.2.0",
        "@angular-devkit/core": "~16.2.0",
        "@angular-devkit/schematics": "~16.2.0",
        "@angular-eslint/eslint-plugin": "~16.0.0",
        "@angular-eslint/eslint-plugin-template": "~16.0.0",
        "@angular-eslint/template-parser": "~16.0.0",
        "@angular/cli": "~16.2.0",
        "@angular/compiler-cli": "~16.2.0",
        "@angular/language-service": "~16.2.0",
        "@nx/eslint-plugin": "16.10.0",
        "@nx/jest": "16.10.0",
        "@nx/js": "16.10.0",
        "@nx/linter": "16.10.0",
        "@nx/playwright": "16.10.0",
        "@nx/web": "16.10.0",
        "@nx/workspace": "16.10.0",
        "@playwright/test": "^1.36.0",
        "@schematics/angular": "~16.2.0",
        "@swc-node/register": "~1.6.7",
        "@swc/core": "~1.3.85",
        "@types/jest": "^29.4.0",
        "@types/node": "^16.11.7",
        "@typescript-eslint/eslint-plugin": "^5.60.1",
        "@typescript-eslint/parser": "^5.60.1",
        "enhanced-resolve": "^5.15.0",
        "eslint": "~8.46.0",
        "eslint-config-prettier": "8.1.0",
        "eslint-plugin-ban": "^1.6.0",
        "eslint-plugin-diff": "^2.0.1",
        "eslint-plugin-import": "latest",
        "eslint-plugin-jsdoc": "^46.4.6",
        "eslint-plugin-playwright": "^0.15.3",
        "eslint-plugin-sonarjs": "^0.20.0",
        "husky": "^8.0.3",
        "jest": "^29.4.1",
        "jest-environment-jsdom": "^29.4.1",
        "jest-preset-angular": "~13.1.0",
        "jsonc-eslint-parser": "^2.1.0",
        "lint-staged": "^15.0.1",
        "nx": "16.10.0",
        "prettier": "^2.6.2",
        "ts-jest": "^29.1.0",
        "ts-node": "10.9.1",
        "typescript": "~5.1.3"
      },
      "lint-staged": {
        "**/*.{html,ts,scss,css}": [
          "prettier --write"
        ],
        "**/*.ts": [
          "npm run lint:all"
        ]
      },
      "husky": {
        "hooks": {
          "pre-commit": "lint-staged"
        }
      }
    }

I have tried the following in my 'transformIgnorePatterns' transformIgnorePatterns: ['node_modules/(?!..mjs$|lodash-es)'], transformIgnorePatterns: ['node_modules/(?!..mjs$|lodash-es)', 'node_modules/@a360'], transformIgnorePatterns: ['node_modules/(?!..mjs$|lodash-es)', 'node_modules/@a360'], transformIgnorePatterns: ['node_modules/(?!..mjs$|lodash-es/@a360)', transformIgnorePatterns: ['node_modules/(?!..mjs$|lodash-es/@a360/)'],

0

There are 0 best solutions below