Skip to content

Problems with converting the notepad example from js to tsx #323

@Singheskan

Description

@Singheskan

I try to convert the given Notepad example from the base proton-native repository into Typescript. I ran into some issues I could not fix.

Code:
TSConfig:
{
"compilerOptions": {
"strict": true,
"target": "es6",
"module": "ES2015"
}
}

package.json:
`{
"name": "notepad",
"version": "1.0.0",
"type": "module",
"description": "a notepad app built using proton-native",
"main": "index.tsx",
"scripts": {
"start": "babel-node index.tsx"
},
"dependencies": {
"@types/jest": "^26.0.22",
"@types/node": "^14.14.37",
"@types/react": "^17.0.3",
"@types/react-dom": "^17.0.3",
"proton-native": "^2.0.0",
"typescript": "^4.2.4"
},
"devDependencies": {
"@babel/cli": "^7.4.4",
"@babel/core": "^7.4.4",
"@babel/node": "^7.2.2",
"@babel/plugin-proposal-class-properties": "^7.4.4",
"@babel/preset-env": "^7.4.4",
"@babel/preset-react": "^7.0.0",
"@babel/preset-stage-0": "^7.0.0"
},
"author": "",
"license": "ISC"
}

I did not change anything in the other files, except of changing index.js to index.tsx.

Error:
babel-node index.tsx

internal/process/esm_loader.js:74
internalBinding('errors').triggerUncaughtException(
^

TypeError [ERR_UNKNOWN_FILE_EXTENSION]: Unknown file extension ".tsx" for C:\xxx\Notepad\index.tsx
at Loader.defaultGetFormat [as _getFormat] (internal/modules/esm/get_format.js:71:15)
at Loader.getFormat (internal/modules/esm/loader.js:102:42)
at Loader.getModuleJob (internal/modules/esm/loader.js:231:31)
at processTicksAndRejections (internal/process/task_queues.js:93:5)
at async Loader.import (internal/modules/esm/loader.js:165:17)
at async Object.loadESM (internal/process/esm_loader.js:68:5) {
code: 'ERR_UNKNOWN_FILE_EXTENSION'
}
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! notepad@1.0.0 start: babel-node index.tsx
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the notepad@1.0.0 start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR! C:\xxx\2021-04-14T08_50_04_846Z-debug.log

Related stackoverflow post

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions