In my project I have 2 files:
foo.js
const image = require('../this/path/is/wrong.png');
boo.tsx
const image = require('../this/path/is/wrong.png');
In foo.js TypeScript correctly finds out that the image does not exists and throws "Cannot find module" error, but no error is thrown for boo.tsx so the bug only shows up on runtime when the app crashes.
If I just rename boo.tsx to boo.js TS again starts throwing the error as expected.
Those are some of my compiler options that I think could be relevant:
"module":"es2015", "target": "es2015", "jsx": "react", "moduleResolution":"Node", "allowJs": true,
I've tried:
- different module and moduleResolution settings
- using import instead of require
- with and without
@types/node
Is there any special tsconfig
settings I am missing or what am I doing wrong?
2 Answers
Answers 1
The require
function has no special meaning in a .ts
or .tsx
file, since TypeScript only uses recognizes syntax for imports.
In a .js
file with allowJs
, it is uses heuristics, and recognizes the require
call as an import.
The more equivalent thing for TypeScript would be something like
import image = require('../this/path/is/wrong.png');
or one of the ES module syntaxes such as
import * as foo from "foo"; import foo from "foo";
Answers 2
try adding "allowSyntheticDefaultImports": true
to your tsconfig
0 comments:
Post a Comment