最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - How to make ts-jest work with importexport syntax of the js files that are being imported in my imports? - Stack Ov

programmeradmin0浏览0评论

jest fails to import the import of my import which is causing npm run test command to fail with SyntaxError: Unexpected token 'export' at first line of my bar.ts file. For this example foo.js is a local file, not a node module. I can change foo.js to foo.ts and change the import in bar.ts but that is not the solution.

Files in my src folder:

  • foo.js:
export const magicNumber = 42; 
  • bar.ts:
import { magicNumber } from './foo.js';

export const secondMagicNumber = magicNumber / 2; 
  • bar.test.ts:
import { secondMagicNumber } from './bar';
import assert from 'assert';

it('should work', function() {
    assert.strictEqual(secondMagicNumber, 21);
});

Files in the root folder:

  • jest.config.js:
export default {
  preset: 'ts-jest',
  testEnvironment: 'node',
};
  • package.json:
{
  "name": "testing-with-jest",
  "version": "1.0.0",
  "description": "",
  "scripts": {
    "test": "jest"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "@types/jest": "^26.0.20",
    "jest": "^26.6.3",
    "ts-jest": "^26.5.2",
    "typescript": "^4.2.2"
  },
  "type": "module"
}
  • tsconfig.json:
{
  "compilerOptions": {
    "target": "ESNext",                         
    "module": "ESNext",                    
    "outDir": "./dist",                                       
    "strict": true,                          
    "esModuleInterop": true,                  
    "skipLibCheck": true,                     
    "forceConsistentCasingInFileNames": true,
    "declaration": true,
    "moduleResolution": "node"
  },
  "include": ["./src/**/*.ts"]
}

jest fails to import the import of my import which is causing npm run test command to fail with SyntaxError: Unexpected token 'export' at first line of my bar.ts file. For this example foo.js is a local file, not a node module. I can change foo.js to foo.ts and change the import in bar.ts but that is not the solution.

Files in my src folder:

  • foo.js:
export const magicNumber = 42; 
  • bar.ts:
import { magicNumber } from './foo.js';

export const secondMagicNumber = magicNumber / 2; 
  • bar.test.ts:
import { secondMagicNumber } from './bar';
import assert from 'assert';

it('should work', function() {
    assert.strictEqual(secondMagicNumber, 21);
});

Files in the root folder:

  • jest.config.js:
export default {
  preset: 'ts-jest',
  testEnvironment: 'node',
};
  • package.json:
{
  "name": "testing-with-jest",
  "version": "1.0.0",
  "description": "",
  "scripts": {
    "test": "jest"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "@types/jest": "^26.0.20",
    "jest": "^26.6.3",
    "ts-jest": "^26.5.2",
    "typescript": "^4.2.2"
  },
  "type": "module"
}
  • tsconfig.json:
{
  "compilerOptions": {
    "target": "ESNext",                         
    "module": "ESNext",                    
    "outDir": "./dist",                                       
    "strict": true,                          
    "esModuleInterop": true,                  
    "skipLibCheck": true,                     
    "forceConsistentCasingInFileNames": true,
    "declaration": true,
    "moduleResolution": "node"
  },
  "include": ["./src/**/*.ts"]
}
Share Improve this question asked Mar 3, 2021 at 21:41 MurolemMurolem 8216 silver badges18 bronze badges
Add a comment  | 

1 Answer 1

Reset to default 20

So the problem is that both ts-jest and jest are tricky to set up for the ES6 import/export syntax. I did exactly that by:

  1. Installing both jest and ts-jest >= 27.0.0 versions.
  2. Using this minimal config:

tsconfig.json:

{
  "compilerOptions": {                    
    "esModuleInterop": true, 
    "allowJs": true                
  }
}

jest.config.ts:

export default {
    globals: {
        extensionsToTreatAsEsm: ['.ts', '.js'],
        'ts-jest': {
            useESM: true
        }
    },

    preset: 'ts-jest/presets/js-with-ts-esm',

    // from https://stackoverflow.com/a/57916712/15076557
    transformIgnorePatterns: [
        'node_modules/(?!(module-that-needs-to-be-transformed)/)' 
    ]
}

与本文相关的文章

发布评论

评论列表(0)

  1. 暂无评论